/* 倾城之主 - 配套CSS样式表 */

/* === 全局基础 === */
.rev-main {
  background: linear-gradient(135deg, #0a0e1a 0%, #141b2d 100%) !important;
  color: #d4a574 !important;
  padding: 24px !important;
  border-radius: 8px !important;
  box-shadow: 0 8px 32px rgba(212, 165, 116, 0.15), inset 0 1px 0 rgba(212, 165, 116, 0.1) !important;
  margin: 16px 0 !important;
  font-size: 14px !important;
  line-height: 1.8 !important;
  border: 1px solid rgba(212, 165, 116, 0.2) !important;
}

/* === 对话与独白 === */
.char-dialogue {
  color: #e6c89f !important;
  font-weight: 500 !important;
}

.inner-thought {
  color: #8b2e5f !important;
  font-style: italic !important;
}

.system-alert {
  background: rgba(139, 46, 95, 0.15) !important;
  color: #d4a574 !important;
  padding: 12px 16px !important;
  border-left: 3px solid #8b2e5f !important;
  margin: 12px 0 !important;
  border-radius: 4px !important;
}

/* === 特殊界面模拟 === */
.sim-ui {
  color: revert !important;
  background: #141b2d !important;
  padding: 16px !important;
  border-radius: 8px !important;
  border: 1px solid rgba(212, 165, 116, 0.3) !important;
  margin: 16px 0 !important;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.4) !important;
}

/* === 状态面板通用样式 === */
[class^="coser-panel"] {
  background: linear-gradient(135deg, #141b2d 0%, #0a0e1a 100%) !important;
  border: 1px solid rgba(212, 165, 116, 0.3) !important;
  border-radius: 8px !important;
  margin: 12px 0 !important;
  padding: 0 !important;
  box-shadow: 0 4px 20px rgba(212, 165, 116, 0.1), 0 0 40px rgba(139, 46, 95, 0.05) !important;
  transition: all 0.3s ease !important;
}

[class^="coser-panel"]:hover {
  border-color: rgba(212, 165, 116, 0.5) !important;
  box-shadow: 0 6px 28px rgba(212, 165, 116, 0.2), 0 0 60px rgba(139, 46, 95, 0.1) !important;
}

[class^="coser-panel"] summary {
  color: #e6c89f !important;
  font-weight: 600 !important;
  font-size: 15px !important;
  padding: 14px 18px !important;
  cursor: pointer !important;
  user-select: none !important;
  background: rgba(212, 165, 116, 0.05) !important;
  border-radius: 8px !important;
  transition: all 0.3s ease !important;
}

[class^="coser-panel"] summary:hover {
  background: rgba(212, 165, 116, 0.12) !important;
  color: #d4a574 !important;
  text-shadow: 0 0 8px rgba(212, 165, 116, 0.4) !important;
}

[class^="coser-panel"][open] summary {
  border-bottom: 1px solid rgba(212, 165, 116, 0.2) !important;
  margin-bottom: 12px !important;
  border-radius: 8px 8px 0 0 !important;
}

[class^="coser-panel"] > *:not(summary) {
  padding: 0 18px 16px 18px !important;
  color: #d4a574 !important;
  font-size: 13px !important;
  line-height: 1.7 !important;
}

/* === 表格样式 === */
[class^="coser-panel"] table {
  width: 100% !important;
  border-collapse: collapse !important;
  margin: 8px 0 !important;
}

[class^="coser-panel"] table th,
[class^="coser-panel"] table td {
  padding: 8px 12px !important;
  border-bottom: 1px solid rgba(212, 165, 116, 0.15) !important;
  color: #d4a574 !important;
  text-align: left !important;
}

[class^="coser-panel"] table th {
  color: #e6c89f !important;
  font-weight: 600 !important;
  background: rgba(212, 165, 116, 0.08) !important;
}

[class^="coser-panel"] table tr:hover {
  background: rgba(139, 46, 95, 0.08) !important;
}

/* === 思维链面板特殊样式 === */
.thinking-panel summary::before {
  content: "⚡ " !important;
  color: #8b2e5f !important;
}

/* === 场景信息面板特殊样式 === */
.scene-panel summary::before {
  content: "🌆 " !important;
  color: #d4a574 !important;
}

/* === 记忆面板特殊样式 === */
.memory-panel summary::after {
  content: " 【" attr(data-count) "】" !important;
  color: #8b2e5f !important;
  font-size: 12px !important;
  margin-left: 8px !important;
}

/* === 玩家角色面板样式 === */
.player-panel {
  border-color: rgba(139, 46, 95, 0.4) !important;
}

.player-panel summary {
  background: linear-gradient(90deg, rgba(139, 46, 95, 0.15), rgba(212, 165, 116, 0.05)) !important;
}

/* === NPC面板样式 === */
.npc-panel summary::before {
  content: "✦ " !important;
  color: #d4a574 !important;
}

/* === 选项系统样式 === */
div:has(> :first-child:contains("你的选择")) {
  background: linear-gradient(135deg, #141b2d 0%, #0a0e1a 100%) !important;
  padding: 20px !important;
  border-radius: 8px !important;
  border: 2px solid rgba(139, 46, 95, 0.4) !important;
  margin: 20px 0 !important;
  box-shadow: 0 6px 24px rgba(139, 46, 95, 0.2) !important;
}

div:has(> :first-child:contains("你的选择")) > :first-child {
  color: #e6c89f !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  margin-bottom: 16px !important;
  text-align: center !important;
  text-shadow: 0 2px 8px rgba(212, 165, 116, 0.3) !important;
  letter-spacing: 2px !important;
}

div:has(> :first-child:contains("你的选择")) > :not(:first-child) {
  background: linear-gradient(90deg, rgba(212, 165, 116, 0.1), rgba(139, 46, 95, 0.05)) !important;
  color: #d4a574 !important;
  padding: 12px 20px !important;
  margin: 8px 0 !important;
  border-radius: 6px !important;
  border-left: 3px solid #8b2e5f !important;
  cursor: pointer !important;
  transition: all 0.3s ease !important;
  font-weight: 500 !important;
}

div:has(> :first-child:contains("你的选择")) > :not(:first-child):hover {
  background: linear-gradient(90deg, rgba(212, 165, 116, 0.2), rgba(139, 46, 95, 0.15)) !important;
  border-left-width: 5px !important;
  transform: translateX(4px) !important;
  box-shadow: 0 4px 16px rgba(139, 46, 95, 0.3), inset 0 0 20px rgba(212, 165, 116, 0.1) !important;
  color: #e6c89f !important;
}

/* === 分隔线样式 === */
hr {
  border: none !important;
  height: 1px !important;
  background: linear-gradient(90deg, transparent, rgba(212, 165, 116, 0.3), transparent) !important;
  margin: 24px 0 !important;
}

/* === 列表样式 === */
.rev-main ul,
.rev-main ol,
[class^="coser-panel"] ul,
[class^="coser-panel"] ol {
  color: #d4a574 !important;
  padding-left: 24px !important;
  margin: 8px 0 !important;
}

.rev-main li,
[class^="coser-panel"] li {
  color: #d4a574 !important;
  margin: 4px 0 !important;
}

/* === 特效增强 === */
@keyframes glow {
  0%, 100% { 
    box-shadow: 0 4px 20px rgba(212, 165, 116, 0.1), 0 0 40px rgba(139, 46, 95, 0.05);
  }
  50% { 
    box-shadow: 0 6px 28px rgba(212, 165, 116, 0.2), 0 0 60px rgba(139, 46, 95, 0.15);
  }
}

[class^="coser-panel"][open] {
  animation: glow 4s ease-in-out infinite !important;
}

/* === 滚动条样式 === */
.rev-main::-webkit-scrollbar,
[class^="coser-panel"]::-webkit-scrollbar {
  width: 8px !important;
}

.rev-main::-webkit-scrollbar-track,
[class^="coser-panel"]::-webkit-scrollbar-track {
  background: rgba(20, 27, 45, 0.5) !important;
  border-radius: 4px !important;
}

.rev-main::-webkit-scrollbar-thumb,
[class^="coser-panel"]::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #d4a574, #8b2e5f) !important;
  border-radius: 4px !important;
}

.rev-main::-webkit-scrollbar-thumb:hover,
[class^="coser-panel"]::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(180deg, #e6c89f, #a03870) !important;
}