/* ========== 0. 全局聊天框背景 ========== */
#chat, #chat-content, .chat, body {
  background:
    radial-gradient(circle at 20% 15%, #ffd9ec 0 2px, transparent 3px) 0 0/24px 24px,
    radial-gradient(circle at 70% 60%, #d9ecff 0 2px, transparent 3px) 12px 12px/24px 24px,
    linear-gradient(135deg, #fff5fb 0%, #fef9f0 50%, #f0f8ff 100%) !important;
  font-family: "Quicksand", "PingFang SC", "Microsoft YaHei", sans-serif;
}

/* 消息气泡通用 */
.mes, .message, .chat-message {
  background: #fffdf8 !important;
  border: 3px solid #2b2b2b !important;
  border-radius: 22px !important;
  box-shadow: 6px 6px 0 #2b2b2b, 6px 6px 0 2px #ffb6d5 !important;
  padding: 18px 20px !important;
  margin: 18px 10px !important;
  color: #2b2b2b !important;
}

/* AI 与用户气泡撞色区分 */
.mes[is_user="true"], .message.user {
  background: linear-gradient(135deg, #fff0f6 0%, #ffe0ec 100%) !important;
}
.mes[is_user="false"], .message.assistant {
  background: linear-gradient(135deg, #fffaf0 0%, #fef3e0 100%) !important;
}

/* ========== 1. 顶部状态条（日期/时间/场景） ========== */
.pop-status-header {
  background: linear-gradient(90deg, #ffb6d5, #ffd89b, #b6e5ff);
  border: 2.5px solid #2b2b2b;
  border-radius: 999px;
  padding: 10px 22px;
  font-weight: 700;
  color: #2b2b2b;
  box-shadow: 4px 4px 0 #2b2b2b;
  margin: 8px 0 16px;
  letter-spacing: 0.5px;
  text-align: center;
}
.pop-status-header .scene { color:#d6336c; }
.pop-status-header .mood { color:#7048e8; }
.pop-status-header .weather { color:#1c7ed6; }

/* ========== 2. 正文叙事卡 ========== */
.pop-narrative {
  background: #fffdf8;
  border: 2.5px solid #2b2b2b;
  border-left: 10px solid #ff85b3;
  border-radius: 18px;
  padding: 18px 22px;
  margin: 14px 0;
  line-height: 1.85;
  font-size: 15px;
  box-shadow: 5px 5px 0 #ffd6e7;
  position: relative;
}
.pop-narrative::before {
  content: "✦";
  position: absolute; top: -14px; left: 18px;
  background: #ff85b3; color: #fff;
  width: 28px; height: 28px; border-radius: 50%;
  border: 2.5px solid #2b2b2b;
  display: flex; align-items: center; justify-content: center;
  font-size: 14px;
}

/* ========== 3. 折叠面板通用 ========== */
.pop-panel {
  margin: 12px 0;
}
.pop-panel > details {
  border: 2.5px solid #2b2b2b;
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 5px 5px 0 #2b2b2b;
}
.pop-panel > details > summary {
  cursor: pointer;
  padding: 12px 20px;
  font-weight: 800;
  font-size: 15px;
  letter-spacing: 1px;
  list-style: none;
  user-select: none;
  border-bottom: 2.5px dashed #2b2b2b;
}
.pop-panel > details[open] > summary { border-bottom: 2.5px solid #2b2b2b; }
.pop-panel .panel-content {
  padding: 16px 20px;
  white-space: pre-wrap;
  font-family: "JetBrains Mono", "Cascadia Code", monospace;
  font-size: 13.5px;
  line-height: 2;
  background: repeating-linear-gradient(
    45deg, transparent 0 12px, rgba(255,255,255,0.4) 12px 13px
  );
}

/* 苏晚 —— 樱花粉 */
.pop-suwan > details { background: #fff0f6; }
.pop-suwan > details > summary {
  background: linear-gradient(90deg, #ffc4dc, #ffb0d0);
  color: #8b1d4a;
}

/* 玩家 —— 薄荷蓝 */
.pop-player > details { background: #f0f8ff; }
.pop-player > details > summary {
  background: linear-gradient(90deg, #b6d8ff, #c8b8ff);
  color: #2a3a8a;
}

/* 记忆 —— 羊皮纸 */
.pop-memory > details { background: #fef7e4; }
.pop-memory > details > summary {
  background: linear-gradient(90deg, #ffe6a8, #ffd084);
  color: #6b4a14;
}
.pop-memory .memory-short, .pop-memory .memory-long {
  margin: 10px 14px;
}
.pop-memory .memory-short > details,
.pop-memory .memory-long > details {
  border: 2px solid #2b2b2b;
  border-radius: 12px;
  background: #fffdf2;
  margin: 8px 0;
}
.pop-memory .memory-short > details > summary,
.pop-memory .memory-long > details > summary {
  padding: 8px 14px;
  background: #fff3cc;
  font-size: 13px;
}

/* 推荐选项 —— 三色 */
.pop-choices > details { background: #fff9fb; }
.pop-choices > details > summary {
  background: linear-gradient(90deg, #ffd6e7, #d6e7ff, #fff0c4);
  color: #2b2b2b;
}

/* ========== 4. 数值与进度条 ========== */
.stat-num {
  display: inline-block;
  min-width: 28px;
  padding: 1px 8px;
  background: #fff;
  border: 2px solid #2b2b2b;
  border-radius: 999px;
  font-weight: 800;
  font-size: 12px;
  margin: 0 3px;
}
.bar {
  font-family: monospace;
  letter-spacing: -1px;
  padding: 2px 8px;
  border: 2px solid #2b2b2b;
  border-radius: 6px;
  background: #fff;
  font-size: 12px;
}
.bar-affection   { color:#ff4f8b; background:#ffe3ef; }
.bar-trust       { color:#1c7ed6; background:#e3f0ff; }
.bar-shame       { color:#e8590c; background:#fff0e0; }
.bar-corruption  { color:#7048e8; background:#efe6ff; }
.bar-experience  { color:#d6336c; background:#ffe0ea; }
.bar-reason      { color:#0ca678; background:#dffaf0; }

/* ========== 5. 心声 / 穿着 / 关系等级 ========== */
.outfit, .makeup, .pose, .player-outfit {
  background: #fff;
  padding: 1px 8px;
  border-radius: 6px;
  border: 1.5px dashed #aa6b8a;
  color: #6b1d4a;
}
.thought-surface {
  background: #f0f8ff;
  padding: 2px 8px;
  border-radius: 6px;
  color: #2a4a8a;
  font-style: italic;
}
.thought-real {
  background: linear-gradient(90deg, #ffe0ec, #ffd0e0);
  padding: 2px 10px;
  border-radius: 6px;
  color: #c41d5a;
  font-weight: 700;
  box-shadow: 2px 2px 0 #2b2b2b;
  font-style: italic;
}
.relation-level {
  display: inline-block;
  background: linear-gradient(135deg, #ff85b3, #ffb86b);
  color: #fff;
  font-weight: 800;
  padding: 2px 14px;
  border: 2px solid #2b2b2b;
  border-radius: 999px;
  box-shadow: 2px 2px 0 #2b2b2b;
  letter-spacing: 1px;
}
.divider-label {
  background: #ffd6e7;
  padding: 0 8px;
  border-radius: 4px;
  font-weight: 700;
  color: #8b1d4a;
}

/* ========== 6. 金钱字段 ========== */
.money, .cost-turn, .cost-month {
  background: #fff8d6;
  border: 2px solid #2b2b2b;
  border-radius: 6px;
  padding: 1px 8px;
  font-weight: 800;
  color: #b07a00;
}
.countdown {
  background: #e3f0ff; color:#1c4a8a;
  padding: 1px 8px; border-radius: 6px;
  border: 2px solid #2b2b2b; font-weight: 800;
}

/* ========== 7. 记忆条目 ========== */
.mem-time   { color:#888; }
.mem-scene  { color:#7048e8; font-weight:700; }
.mem-event  { color:#2b2b2b; }
.mem-delta  { color:#d6336c; font-weight:700; }
.mem-stage  {
  background:#ffd084; padding:0 8px; border-radius:4px;
  border:1.5px solid #2b2b2b; font-weight:800;
}
.mem-impact { color:#6b4a14; font-style:italic; }

/* ========== 8. 推荐选项三档色阶 ========== */
.choice {
  border: 2.5px solid #2b2b2b;
  border-radius: 14px;
  padding: 10px 14px;
  margin: 10px 0;
  font-weight: 700;
  box-shadow: 4px 4px 0 #2b2b2b;
  transition: transform .15s;
}
.choice:hover { transform: translate(-2px,-2px); box-shadow: 6px 6px 0 #2b2b2b; }
.choice-safe  { background: linear-gradient(135deg,#d8f5e1,#b6f0c8); }
.choice-flirt { background: linear-gradient(135deg,#ffe0ec,#ffc4dc); }
.choice-bold  { background: linear-gradient(135deg,#ffd0d0,#ffb0a8); }
.choice-text  { font-size: 14.5px; color:#2b2b2b; }
.choice-hint  {
  color:#6b4a8a; font-size:12.5px; font-style:italic;
  background:#fff; padding:1px 8px; border-radius:6px;
  border:1.5px dashed #aaa;
}
.choice-free {
  text-align:center; margin-top:14px; padding:10px;
  background: repeating-linear-gradient(45deg,#fff5fb 0 8px,#ffe8f2 8px 16px);
  border: 2.5px dashed #ff85b3; border-radius: 14px;
  color:#8b1d4a; font-weight:700;
}

/* ========== 9. 输入框外壳（保留原生 textarea） ========== */
#send_form, .input-area, .chat-input-container {
  background: linear-gradient(135deg,#fff0f6,#fef3e0,#f0f8ff) !important;
  border: 3px solid #2b2b2b !important;
  border-radius: 22px !important;
  box-shadow: 6px 6px 0 #ffb6d5, 6px 6px 0 2px #2b2b2b !important;
  padding: 8px !important;
  margin: 10px !important;
}
#send_form textarea, .chat-input-container textarea {
  /* 留空——按你要求不动原生输入框 */
}
#send_but, .send-btn {
  background: linear-gradient(135deg,#ff85b3,#ffb86b) !important;
  border: 2.5px solid #2b2b2b !important;
  border-radius: 50% !important;
  box-shadow: 3px 3px 0 #2b2b2b !important;
  color:#fff !important;
}

/* ========== 10. 模组评论 / 系统提示 / 楼层信息 ========== */
.mes_block .name_text, .message .username,
.swipes-counter, .mes_buttons, .extraMesButtons {
  background: #fff !important;
  border: 2px solid #2b2b2b !important;
  border-radius: 999px !important;
  padding: 2px 10px !important;
  font-weight: 700 !important;
  color: #2b2b2b !important;
  box-shadow: 2px 2px 0 #ffb6d5 !important;
}
.mes_buttons div, .extraMesButtons div {
  border-radius: 999px !important;
  background: #fff5fb !important;
  margin: 2px !important;
}
blockquote, .system-note, .comment {
  background: repeating-linear-gradient(45deg,#fffaf0 0 10px,#fff3e0 10px 20px) !important;
  border-left: 6px solid #ffb86b !important;
  border-radius: 12px !important;
  padding: 10px 14px !important;
  color: #6b4a14 !important;
  font-style: italic;
}

/* ========== 11. 滚动条 ========== */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: #fff0f6; border-radius: 10px; }
::-webkit-scrollbar-thumb {
  background: linear-gradient(#ff85b3,#ffb86b);
  border-radius: 10px; border: 2px solid #2b2b2b;
}