/* ==================== 暗黑校园风格 - 状态栏系统 ==================== */
/* 顶层容器 - 暗黑基调 */
.status-panel {
  background: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%) !important;
  color: #eaeaea !important;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Microsoft YaHei", sans-serif !important;
  border: 2px solid #0f3460 !important;
  border-radius: 12px !important;
  padding: 20px !important;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.6), inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  position: relative !important;
  isolation: isolate !important;
}
/* 暗黑背景装饰 - 使用SMIL动画的星空效果 */
.status-panel::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  background-image: 
    url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%"><circle cx="10%" cy="15%" r="1.5" fill="white" opacity="0.3"><animate attributeName="opacity" values="0.3;0.8;0.3" dur="3s" repeatCount="indefinite"/></circle><circle cx="85%" cy="25%" r="1" fill="white" opacity="0.4"><animate attributeName="opacity" values="0.4;0.9;0.4" dur="4s" repeatCount="indefinite"/></circle><circle cx="45%" cy="40%" r="1.2" fill="white" opacity="0.35"><animate attributeName="opacity" values="0.35;0.75;0.35" dur="3.5s" repeatCount="indefinite"/></circle><circle cx="70%" cy="60%" r="1" fill="white" opacity="0.3"><animate attributeName="opacity" values="0.3;0.7;0.3" dur="4.2s" repeatCount="indefinite"/></circle><circle cx="20%" cy="75%" r="1.3" fill="white" opacity="0.4"><animate attributeName="opacity" values="0.4;0.85;0.4" dur="3.8s" repeatCount="indefinite"/></circle></svg>') !important;
  background-size: cover !important;
  pointer-events: none !important;
  z-index: 0 !important;
  border-radius: 12px !important;
}
.status-panel > * {
  position: relative !important;
  z-index: 1 !important;
}
/* 时间地点栏 - 白底黑字 */
.time-location-bar {
  display: flex !important;
  justify-content: space-between !important;
  gap: 12px !important;
  margin-bottom: 20px !important;
  flex-wrap: wrap !important;
}
.time-status,
.location-status {
  background: #ffffff !important;
  color: #1a1a1a !important;
  border: 2px solid #333333 !important;
  border-radius: 8px !important;
  padding: 10px 16px !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-weight: 600 !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3) !important;
  flex: 1 !important;
  min-width: 140px !important;
  transition: transform 0.2s ease, box-shadow 0.2s ease !important;
}
.time-status:hover,
.location-status:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.4) !important;
}
.time-icon,
.location-icon {
  font-size: 18px !important;
}
.time-value,
.location-value {
  font-size: 14px !important;
  letter-spacing: 0.3px !important;
}
/* 正文区域 - 深色背景浅粉色文字 */
.content-text {
  background: linear-gradient(135deg, #0f0f1e 0%, #1a1a2e 100%) !important;
  color: #ffb3d9 !important;
  border: 2px solid #ff69b4 !important;
  border-radius: 10px !important;
  padding: 20px !important;
  margin-bottom: 20px !important;
  line-height: 1.8 !important;
  font-size: 15px !important;
  box-shadow: 0 4px 16px rgba(255, 105, 180, 0.2), inset 0 1px 0 rgba(255, 179, 217, 0.1) !important;
  min-height: 100px !important;
}
/* 折叠栏通用样式 - 黑底白字 */
.character-section,
.interaction-section {
  background: linear-gradient(135deg, #0a0a0a 0%, #1a1a1a 100%) !important;
  border: 2px solid #333333 !important;
  border-radius: 10px !important;
  margin-bottom: 16px !important;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.5) !important;
  overflow: hidden !important;
}
.section-header {
  background: linear-gradient(90deg, #1a1a1a 0%, #2a2a2a 100%) !important;
  color: #ffffff !important;
  padding: 14px 18px !important;
  cursor: pointer !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  font-weight: bold !important;
  font-size: 16px !important;
  border-bottom: 1px solid #444444 !important;
  transition: background 0.3s ease !important;
  list-style: none !important;
}
.section-header::-webkit-details-marker {
  display: none !important;
}
.section-header:hover {
  background: linear-gradient(90deg, #2a2a2a 0%, #3a3a3a 100%) !important;
}
.section-title {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}
.toggle-icon {
  transition: transform 0.3s ease !important;
  font-size: 12px !important;
  color: #aaaaaa !important;
}
details[open] > .section-header .toggle-icon {
  transform: rotate(180deg) !important;
}
/* 状态网格 */
.character-status,
.interaction-status {
  padding: 18px !important;
  background: #0f0f0f !important;
}
.status-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)) !important;
  gap: 12px !important;
}
.status-item {
  display: flex !important;
  align-items: baseline !important;
  gap: 6px !important;
  padding: 8px 12px !important;
  background: rgba(255, 255, 255, 0.03) !important;
  border: 1px solid #2a2a2a !important;
  border-radius: 6px !important;
  transition: background 0.2s ease, border-color 0.2s ease !important;
}
.status-item:hover {
  background: rgba(255, 255, 255, 0.06) !important;
  border-color: #3a3a3a !important;
}
.status-item.full-width {
  grid-column: 1 / -1 !important;
  flex-direction: column !important;
  align-items: stretch !important;
}
.label {
  color: #aaaaaa !important;
  font-weight: 600 !important;
  font-size: 13px !important;
  white-space: nowrap !important;
}
.value {
  color: #ffffff !important;
  font-size: 14px !important;
  flex: 1 !important;
}
/* 双栏布局容器 */
.dual-details-container {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 12px !important;
  margin-top: 8px !important;
}
/* 内嵌折叠框 */
.detail-box {
  background: rgba(0, 0, 0, 0.3) !important;
  border: 1px solid #3a3a3a !important;
  border-radius: 6px !important;
  overflow: hidden !important;
}
.detail-summary {
  background: #1a1a1a !important;
  color: #ffffff !important;
  padding: 10px 12px !important;
  cursor: pointer !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  transition: background 0.2s ease !important;
  list-style: none !important;
}
.detail-summary::-webkit-details-marker {
  display: none !important;
}
.detail-summary:hover {
  background: #2a2a2a !important;
}
.detail-title {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
}
.detail-toggle {
  font-size: 10px !important;
  color: #888888 !important;
  transition: transform 0.3s ease !important;
}
details[open] > .detail-summary .detail-toggle {
  transform: rotate(180deg) !important;
}
.detail-content {
  padding: 12px !important;
  background: rgba(0, 0, 0, 0.2) !important;
}
.relationship-list {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}
.relationship-list li {
  padding: 6px 0 !important;
  color: #dddddd !important;
  font-size: 13px !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
}
.relationship-list li:last-child {
  border-bottom: none !important;
}
/* 内心想法与环境 */
.thoughts,
.environment,
.appearance {
  color: #e0e0e0 !important;
  font-size: 13px !important;
  line-height: 1.6 !important;
  padding: 10px !important;
  background: rgba(0, 0, 0, 0.3) !important;
  border-left: 3px solid #ff69b4 !important;
  border-radius: 4px !important;
  margin-top: 6px !important;
  font-style: italic !important;
}
.environment {
  border-left-color: #4a90e2 !important;
  font-style: normal !important;
}
.appearance {
  border-left-color: #9b59b6 !important;
  font-style: normal !important;
}
/* ==================== 校园档案（记忆区）美化 ==================== */
/* 校园档案主容器 */
.bubble-card.memory {
  background: linear-gradient(135deg, #0a0a0a 0%, #1a1a1a 100%) !important;
  border: 2px solid #333333 !important;
  border-radius: 10px !important;
  margin-bottom: 16px !important;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.5) !important;
  overflow: hidden !important;
  position: relative !important;
}
/* 校园档案标题栏 */
.bubble-card.memory > summary {
  background: linear-gradient(90deg, #1a1a1a 0%, #2a2a2a 100%) !important;
  color: #ffffff !important;
  padding: 14px 18px !important;
  cursor: pointer !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  font-weight: bold !important;
  font-size: 16px !important;
  border-bottom: 1px solid #444444 !important;
  transition: background 0.3s ease !important;
  list-style: none !important;
}
.bubble-card.memory > summary::-webkit-details-marker {
  display: none !important;
}
.bubble-card.memory > summary:hover {
  background: linear-gradient(90deg, #2a2a2a 0%, #3a3a3a 100%) !important;
}
.bubble-card.memory > summary::after {
  content: '▼' !important;
  font-size: 12px !important;
  color: #aaaaaa !important;
  transition: transform 0.3s ease !important;
}
.bubble-card.memory[open] > summary::after {
  transform: rotate(180deg) !important;
}
/* 校园档案内容区 */
.bubble-card.memory > .content {
  padding: 18px !important;
  background: #0f0f0f !important;
}
/* 记忆规则说明框 */
.memory-rules {
  background: rgba(255, 215, 0, 0.1) !important;
  border: 1px solid #ffd700 !important;
  border-left: 4px solid #ffd700 !important;
  border-radius: 6px !important;
  padding: 14px !important;
  margin-bottom: 16px !important;
  color: #ffd700 !important;
  font-size: 13px !important;
  line-height: 1.6 !important;
}
.memory-rules p {
  margin: 8px 0 !important;
  padding: 0 !important;
}
.memory-rules strong {
  color: #ffffff !important;
  font-weight: 700 !important;
}
/* 子记忆区（短期/长期） */
.sub-memory {
  background: rgba(0, 0, 0, 0.3) !important;
  border: 1px solid #3a3a3a !important;
  border-radius: 8px !important;
  margin-bottom: 12px !important;
  overflow: hidden !important;
}
.sub-memory > summary {
  background: #1a1a1a !important;
  color: #ffffff !important;
  padding: 12px 16px !important;
  cursor: pointer !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  transition: background 0.2s ease !important;
  list-style: none !important;
  border-bottom: 1px solid #444444 !important;
}
.sub-memory > summary::-webkit-details-marker {
  display: none !important;
}
.sub-memory > summary:hover {
  background: #2a2a2a !important;
}
.sub-memory > summary::after {
  content: '▼' !important;
  font-size: 10px !important;
  color: #888888 !important;
  transition: transform 0.3s ease !important;
}
.sub-memory[open] > summary::after {
  transform: rotate(180deg) !important;
}
/* 记忆列表容器 */
.sub-memory .content {
  padding: 14px !important;
  background: rgba(0, 0, 0, 0.2) !important;
}
/* 记忆条目 */
.memory-item {
  background: rgba(255, 255, 255, 0.03) !important;
  border: 1px solid #2a2a2a !important;
  border-left: 3px solid #ff69b4 !important;
  border-radius: 6px !important;
  padding: 12px !important;
  margin-bottom: 10px !important;
  transition: background 0.2s ease, border-left-color 0.2s ease !important;
}
.memory-item:hover {
  background: rgba(255, 255, 255, 0.06) !important;
  border-left-color: #ff1493 !important;
}
.memory-item:last-child {
  margin-bottom: 0 !important;
}
/* 记忆元数据（时间、地点等） */
.memory-meta {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
  margin-bottom: 8px !important;
  font-size: 12px !important;
  color: #aaaaaa !important;
}
.memory-meta span {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  background: rgba(255, 255, 255, 0.05) !important;
  padding: 4px 8px !important;
  border-radius: 4px !important;
}
.memory-meta span::before {
  content: attr(data-icon) !important;
}
/* 记忆内容文本 */
.memory-text {
  color: #dddddd !important;
  font-size: 13px !important;
  line-height: 1.6 !important;
}
/* 记忆编号标签 */
.memory-number {
  display: inline-block !important;
  background: linear-gradient(135deg, #ff1493 0%, #ff69b4 100%) !important;
  color: #ffffff !important;
  font-weight: bold !important;
  font-size: 11px !important;
  padding: 3px 8px !important;
  border-radius: 4px !important;
  margin-right: 8px !important;
}
/* ==================== Hard难度隐藏机制 ==================== */
/* 当难度为Hard时，隐藏主角的关系状态详情 */
.status-panel[data-difficulty="hard"] .user-relationship .rel-status {
  display: none !important;
}
/* 当难度为Hard时，隐藏NPC的关系状态详情 */
.status-panel[data-difficulty="hard"] .npc-relationship .rel-status {
  display: none !important;
}
/* 当难度为Hard时，隐藏NPC的真实数据，显示问号占位符 */
.status-panel[data-difficulty="hard"] .npc-hidden-item .npc-affection,
.status-panel[data-difficulty="hard"] .npc-hidden-item .npc-lust,
.status-panel[data-difficulty="hard"] .npc-hidden-item .npc-thoughts {
  display: none !important;
}
.status-panel[data-difficulty="hard"] .npc-hidden-item .hidden-placeholder {
  display: block !important;
  color: #888888 !important;
  font-style: italic !important;
}
/* 默认隐藏占位符 */
.hidden-placeholder {
  display: none !important;
}
/* ==================== 移动端适配 ==================== */
@media (max-width: 768px) {
  .status-panel {
    padding: 16px !important;
  }
  .time-location-bar {
    flex-direction: column !important;
  }
  .status-grid {
    grid-template-columns: 1fr !important;
  }
  .dual-details-container {
    grid-template-columns: 1fr !important;
  }
  /* 校园档案移动端优化 */
  .bubble-card.memory > summary {
    padding: 12px 14px !important;
    font-size: 14px !important;
  }
  .memory-rules {
    padding: 12px !important;
    font-size: 12px !important;
  }
  .sub-memory > summary {
    padding: 10px 12px !important;
    font-size: 13px !important;
  }
  .memory-item {
    padding: 10px !important;
  }
  .memory-meta {
    font-size: 11px !important;
    gap: 6px !important;
  }
  .memory-text {
    font-size: 12px !important;
  }
}
/* ==================== 暗黑校园风格 - 聊天框系统 ==================== */
/* 统一聊天框基础样式 */
.bg-gray-100\/90.relative.inline-block {
  background: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%) !important;
  border: 2px solid #0f3460 !important;
  border-radius: 12px !important;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
  padding: 16px !important;
  position: relative !important;
  isolation: isolate !important;
}
/* 聊天框暗黑背景装饰 */
.bg-gray-100\/90.relative.inline-block::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  background-image: 
    url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%"><circle cx="15%" cy="20%" r="1" fill="white" opacity="0.2"><animate attributeName="opacity" values="0.2;0.6;0.2" dur="3s" repeatCount="indefinite"/></circle><circle cx="80%" cy="30%" r="0.8" fill="white" opacity="0.25"><animate attributeName="opacity" values="0.25;0.7;0.25" dur="3.5s" repeatCount="indefinite"/></circle><circle cx="50%" cy="50%" r="1.2" fill="white" opacity="0.3"><animate attributeName="opacity" values="0.3;0.75;0.3" dur="4s" repeatCount="indefinite"/></circle></svg>') !important;
  background-size: cover !important;
  pointer-events: none !important;
  z-index: 0 !important;
  border-radius: 12px !important;
}
/* 单独的输入聊天框 - 浅粉色调 */
.bg-gray-100\/90.relative.inline-block:not(.chat-answer-container .bg-gray-100\/90) {
  background: linear-gradient(135deg, #ffe4f0 0%, #ffd1e3 100%) !important;
  border: 2px solid #ff69b4 !important;
  box-shadow: 0 6px 20px rgba(255, 105, 180, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.4) !important;
}
.bg-gray-100\/90.relative.inline-block:not(.chat-answer-container .bg-gray-100\/90)::before {
  background-image: 
    url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%"><circle cx="20%" cy="25%" r="1.5" fill="%23ff1493" opacity="0.15"><animate attributeName="opacity" values="0.15;0.4;0.15" dur="3s" repeatCount="indefinite"/></circle><circle cx="75%" cy="40%" r="1" fill="%23ff69b4" opacity="0.2"><animate attributeName="opacity" values="0.2;0.5;0.2" dur="3.5s" repeatCount="indefinite"/></circle></svg>') !important;
}
/* 聊天框主要文本内容 - 高对比度 */
.markdown-body {
  color: #1a1a1a !important;
  font-size: 15px !important;
  line-height: 1.7 !important;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Microsoft YaHei", sans-serif !important;
  background: transparent !important;
  z-index: 1 !important;
  position: relative !important;
}
/* 输出聊天框的文本为白色 */
.chat-answer-container .markdown-body {
  color: #ffffff !important;
}
/* 隐藏顶部颜色装饰条 */
[class*="bg-[#F1CBCB]"], 
[class*="bg-[#c9e1e9]"] {
  display: none !important;
}
/* 底部附加元素 - 统一浅色 */
.MuiButtonBase-root.MuiButton-root.MuiButton-text.MuiButton-textPrimary,
.MuiTypography-root.MuiTypography-body2.css-6c0gf2,
.text-orange-500 {
  color: #eaeaea !important;
  transition: color 0.2s ease, transform 0.2s ease !important;
}
.MuiButtonBase-root.MuiButton-root.MuiButton-text.MuiButton-textPrimary:hover {
  color: #ffffff !important;
  transform: scale(1.05) !important;
}
/* 自定义加载动画 - 暗黑校园风骷髅头 */
.style_dot-flashing__8L91Q.style_text__zGhNq {
  display: none !important;
}
.flex.items-center.justify-center.w-6.h-5 {
  position: relative !important;
  height: 40px !important;
  isolation: isolate !important;
}
/* 骷髅头加载动画（SMIL优先） */
.flex.items-center.justify-center.w-6.h-5::before {
  content: '' !important;
  position: absolute !important;
  width: 30px !important;
  height: 30px !important;
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 50 50"><ellipse cx="25" cy="20" rx="12" ry="14" fill="%23eaeaea" opacity="0.9"/><ellipse cx="25" cy="28" rx="8" ry="6" fill="%23eaeaea" opacity="0.9"/><circle cx="20" cy="18" r="2.5" fill="%231a1a2e"/><circle cx="30" cy="18" r="2.5" fill="%231a1a2e"/><path d="M 20 26 Q 25 29 30 26" stroke="%231a1a2e" stroke-width="1.5" fill="none"/><animate attributeName="opacity" values="0.4;1;0.4" dur="1.5s" repeatCount="indefinite"/><animateTransform attributeName="transform" type="rotate" from="0 25 25" to="360 25 25" dur="3s" repeatCount="indefinite"/></svg>') !important;
  background-size: contain !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  z-index: 1 !important;
  left: 50% !important;
  top: 50% !important;
  transform: translate(-50%, -50%) !important;
}
/* 脉冲光晕效果 */
.flex.items-center.justify-center.w-6.h-5::after {
  content: '' !important;
  position: absolute !important;
  width: 40px !important;
  height: 40px !important;
  background: radial-gradient(circle, rgba(255, 105, 180, 0.3) 0%, transparent 70%) !important;
  border-radius: 50% !important;
  z-index: 0 !important;
  left: 50% !important;
  top: 50% !important;
  transform: translate(-50%, -50%) !important;
  animation: pulse-glow 2s ease-in-out infinite !important;
}
@keyframes pulse-glow {
  0%, 100% {
    transform: translate(-50%, -50%) scale(1) !important;
    opacity: 0.3 !important;
  }
  50% {
    transform: translate(-50%, -50%) scale(1.3) !important;
    opacity: 0.6 !important;
  }
}
/* 移动端加载动画适配 */
@media (max-width: 480px) {
  .flex.items-center.justify-center.w-6.h-5::before {
    width: 25px !important;
    height: 25px !important;
  }
  .flex.items-center.justify-center.w-6.h-5::after {
    width: 35px !important;
    height: 35px !important;
  }
}
/* 低动效模式 */
@media (prefers-reduced-motion: reduce) {
  .flex.items-center.justify-center.w-6.h-5::before {
    animation-duration: 4s !important;
  }
  .flex.items-center.justify-center.w-6.h-5::after {
    animation-duration: 3s !important;
  }
}
/* ==================== 暗黑校园风格 - 顶部栏/底部栏/评论区 ==================== */
/* 顶部栏主容器 */
.sticky.w-full.top-0.flex.items-center {
  background: linear-gradient(135deg, #0a0a0a 0%, #1a1a1a 100%) !important;
  border-bottom: 2px solid #333333 !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.6) !important;
  padding: 12px 16px !important;
}
/* 模型选择器 */
#ai-model-selector .group.flex.items-center {
  background: linear-gradient(90deg, #1a1a1a 0%, #2a2a2a 100%) !important;
  border: 1px solid #444444 !important;
  border-radius: 8px !important;
  padding: 8px 14px !important;
  transition: all 0.3s ease !important;
}
#ai-model-selector .group.flex.items-center:hover {
  background: linear-gradient(90deg, #2a2a2a 0%, #3a3a3a 100%) !important;
  border-color: #ff69b4 !important;
  box-shadow: 0 0 12px rgba(255, 105, 180, 0.3) !important;
}
#ai-model-selector .truncate.text-\[13px\] {
  color: #ffffff !important;
  font-weight: 600 !important;
}
#ai-model-selector .shrink-0.flex.items-center svg {
  color: #aaaaaa !important;
  transition: transform 0.3s ease, color 0.3s ease !important;
}
#ai-model-selector .group:hover svg {
  color: #ff69b4 !important;
  transform: rotate(180deg) !important;
}
/* 设置按钮 */
#header-setting-button {
  background: #1a1a1a !important;
  border: 1px solid #444444 !important;
  border-radius: 8px !important;
  color: #ffffff !important;
  transition: all 0.3s ease !important;
}
#header-setting-button:hover {
  background: #2a2a2a !important;
  border-color: #ff69b4 !important;
  box-shadow: 0 0 12px rgba(255, 105, 180, 0.3) !important;
}
/* 开场白选择器 */
div.flex.items-center.h-9.bg-white.rounded-md.cursor-pointer.group[class*="border-gray"] {
  background: linear-gradient(90deg, #1a1a1a 0%, #2a2a2a 100%) !important;
  border: 1px solid #444444 !important;
  transition: all 0.3s ease !important;
}
div.flex.items-center.h-9.cursor-pointer.group:hover {
  background: linear-gradient(90deg, #2a2a2a 0%, #3a3a3a 100%) !important;
  border-color: #ff69b4 !important;
}
div.flex.items-center.h-9.cursor-pointer.group svg {
  color: #aaaaaa !important;
  transition: color 0.3s ease !important;
}
div.flex.items-center.h-9.cursor-pointer.group:hover svg {
  color: #ff69b4 !important;
}
/* 按钮栏 */
#ai-mod-button2 {
  background: linear-gradient(135deg, #0a0a0a 0%, #1a1a1a 100%) !important;
  padding: 12px !important;
  border-top: 1px solid #333333 !important;
}
#ai-mod-button2 button.MuiButton-root {
  background: #1a1a1a !important;
  border: 1px solid #444444 !important;
  color: #ffffff !important;
  border-radius: 8px !important;
  padding: 8px 16px !important;
  transition: all 0.3s ease !important;
}
#ai-mod-button2 button.MuiButton-root:hover {
  background: #2a2a2a !important;
  border-color: #ff69b4 !important;
  box-shadow: 0 0 12px rgba(255, 105, 180, 0.3) !important;
  transform: translateY(-2px) !important;
}
#ai-mod-button2 button.MuiButton-root svg {
  color: #aaaaaa !important;
  transition: color 0.3s ease !important;
}
#ai-mod-button2 button.MuiButton-root:hover svg {
  color: #ff69b4 !important;
}
/* 底部栏外层背景 */
.bg-gradient-to-t {
  background: linear-gradient(to top, #0a0a0a 0%, #1a1a1a 100%) !important;
  border-top: 2px solid #333333 !important;
}
/* 输入框容器 */
#ai-chat-bottom-input {
  background: #1a1a1a !important;
  border: 2px solid #444444 !important;
  border-radius: 12px !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
  transition: border-color 0.3s ease, box-shadow 0.3s ease !important;
}
#ai-chat-bottom-input:focus-within {
  border-color: #ff69b4 !important;
  box-shadow: 0 4px 16px rgba(255, 105, 180, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
}
/* 主输入框 - 浅粉色字体 */
#ai-chat-input {
  color: #ffb3d9 !important;
  font-size: 15px !important;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Microsoft YaHei", sans-serif !important;
  background: transparent !important;
  font-weight: 500 !important;
}
#ai-chat-input::placeholder {
  color: #ff69b4 !important;
  opacity: 0.5 !important;
  font-style: italic !important;
}
#ai-chat-input::selection {
  background: rgba(255, 105, 180, 0.4) !important;
  color: #ffffff !important;
}
/* 分页栏 */
.MuiPaginationItem-root {
  background: #1a1a1a !important;
  border: 1px solid #444444 !important;
  color: #ffffff !important;
  border-radius: 6px !important;
  transition: all 0.3s ease !important;
}
.MuiPaginationItem-root:hover {
  background: #2a2a2a !important;
  border-color: #ff69b4 !important;
}
.MuiPaginationItem-root.Mui-selected {
  background: linear-gradient(135deg, #ff1493 0%, #ff69b4 100%) !important;
  border-color: #ff1493 !important;
  color: #ffffff !important;
  font-weight: bold !important;
}
.MuiPaginationItem-root.Mui-disabled {
  background: #0a0a0a !important;
  border-color: #2a2a2a !important;
  color: #444444 !important;
}
.MuiPaginationItem-icon {
  color: #aaaaaa !important;
}
.MuiPaginationItem-root:hover .MuiPaginationItem-icon {
  color: #ff69b4 !important;
}
/* 跳转输入区域 */
.MuiStack-root.css-1uwir8f {
  background: #1a1a1a !important;
  border: 1px solid #444444 !important;
  border-radius: 8px !important;
  padding: 8px 12px !important;
}
.MuiStack-root.css-1uwir8f .MuiBox-root {
  color: #ffffff !important;
}
.MuiInputBase-input {
  background: #0a0a0a !important;
  border: 1px solid #333333 !important;
  color: #ffffff !important;
  border-radius: 4px !important;
  padding: 6px 10px !important;
}
.MuiInputBase-input:focus {
  border-color: #ff69b4 !important;
  outline: none !important;
}
/* 评论区背景容器 */
div[class*="w-full"][class*="bg-white"][class*="bottom-0"] {
  background: linear-gradient(135deg, #0a0a0a 0%, #1a1a1a 100%) !important;
  border-top: 2px solid #333333 !important;
  box-shadow: 0 -4px 12px rgba(0, 0, 0, 0.6) !important;
}
/* 顶部标题 */
div.text-lg.font-bold {
  color: #ffffff !important;
  border-bottom: 2px solid #ff69b4 !important;
  padding-bottom: 8px !important;
}
/* 个人评分文字 */
p.MuiTypography-body1.text-grey-600 {
  color: #aaaaaa !important;
}
/* 评分星星 */
span.MuiRating-iconEmpty svg {
  color: #444444 !important;
}
span.MuiRating-iconFilled svg {
  color: #ffd700 !important;
  filter: drop-shadow(0 0 4px rgba(255, 215, 0, 0.5)) !important;
}
span.text-orange-500 {
  color: #ff69b4 !important;
  font-weight: bold !important;
}
/* 输入框容器 */
div.flex.flex-col.border-gray-200 {
  background: #1a1a1a !important;
  border: 2px solid #444444 !important;
  border-radius: 8px !important;
}
/* 评论区输入框 - 浅粉色字体 */
textarea.rc-textarea {
  background: #0a0a0a !important;
  color: #ffb3d9 !important;
  border: 1px solid #333333 !important;
  border-radius: 6px !important;
  font-weight: 500 !important;
}
textarea.rc-textarea:focus {
  border-color: #ff69b4 !important;
  outline: none !important;
}
textarea.rc-textarea::placeholder {
  color: #ff69b4 !important;
  opacity: 0.5 !important;
}
textarea.rc-textarea::selection {
  background: rgba(255, 105, 180, 0.4) !important;
  color: #ffffff !important;
}
/* 字数统计 */
div.bg-gray-100.text-gray-500 {
  background: #1a1a1a !important;
  color: #666666 !important;
}
/* 发送评论按钮 */
div.cursor-pointer.group.flex.items-center.justify-center {
  background: linear-gradient(135deg, #ff1493 0%, #ff69b4 100%) !important;
  border-radius: 8px !important;
  transition: all 0.3s ease !important;
}
div.cursor-pointer.group:hover {
  background: linear-gradient(135deg, #ff69b4 0%, #ff1493 100%) !important;
  box-shadow: 0 0 16px rgba(255, 105, 180, 0.5) !important;
  transform: scale(1.05) !important;
}
div[data-state="closed"] svg[data-icon="Send03"] {
  color: #ffffff !important;
}
/* 分割线 */
div.style_divider__mW0YX {
  background: #333333 !important;
  height: 2px !important;
}
/* 排序按钮 */
button.MuiButton-containedPrimary {
  background: linear-gradient(135deg, #ff1493 0%, #ff69b4 100%) !important;
  color: #ffffff !important;
  border: none !important;
}
button.MuiButton-outlinedPrimary {
  background: transparent !important;
  border: 1px solid #444444 !important;
  color: #aaaaaa !important;
}
button.MuiButton-outlinedPrimary:hover {
  border-color: #ff69b4 !important;
  color: #ff69b4 !important;
}
/* 评论列表容器 */
div.p-3.overflow-y-auto {
  background: #0a0a0a !important;
}
/* 评论项 */
div.group.ml-0 {
  background: #1a1a1a !important;
  border: 1px solid #333333 !important;
  border-radius: 8px !important;
  padding: 12px !important;
  margin-bottom: 12px !important;
  transition: border-color 0.3s ease !important;
}
div.group.ml-0:hover {
  border-color: #ff69b4 !important;
}
/* 用户头像 */
div.group img.rounded-full {
  border: 2px solid #444444 !important;
  box-shadow: 0 0 8px rgba(255, 105, 180, 0.3) !important;
}
/* 用户名 */
div.text-sm.text-grey-600 span.font-bold {
  color: #ffffff !important;
}
/* "（你）"标签 */
span.text-\[10px\] {
  color: #ff69b4 !important;
  background: rgba(255, 105, 180, 0.2) !important;
  padding: 2px 6px !important;
  border-radius: 4px !important;
}
/* 评论内容 */
div.break-all {
  color: #dddddd !important;
}
/* 时间戳 */
div.text-xs.text-grey-600 {
  color: #666666 !important;
}
/* 点赞按钮 */
button.text-gray-400 {
  color: #666666 !important;
  transition: color 0.3s ease, transform 0.3s ease !important;
}
button.text-gray-400:hover {
  color: #ff69b4 !important;
  transform: scale(1.1) !important;
}
button.text-gray-400 svg {
  transition: fill 0.3s ease !important;
}
button.text-gray-400:hover svg {
  fill: #ff69b4 !important;
}
/* 回复按钮 */
span.cursor-pointer {
  color: #aaaaaa !important;
  transition: color 0.3s ease !important;
}
span.cursor-pointer:hover {
  color: #ff69b4 !important;
}
/* 回复区域边框 */
div.ml-8.border-l {
  border-left: 2px solid #444444 !important;
  padding-left: 12px !important;
}
/* 移动端适配 */
@media (max-width: 768px) {
  .sticky.w-full.top-0.flex.items-center {
    padding: 10px 12px !important;
  }
  #ai-mod-button2 {
    padding: 10px !important;
  }
  div.group.ml-0 {
    padding: 10px !important;
  }
}