/* Coser私房摄影师 · 浅色系优雅风格 + 流式评论区按钮美化 */
.coser-wrap {
  background: linear-gradient(145deg, #f5f0eb, #e8e0d8);
  color: #4a3b2c;
  font-family: 'Segoe UI', 'Roboto', 'Noto Sans SC', 'Inter', sans-serif;
  border-radius: 28px;
  padding: 20px;
  max-width: 760px;
  margin: 20px auto;
  border: 1px solid #d9cfc2;
  box-shadow: 0 8px 20px rgba(0,0,0,0.06);
  position: relative;
}

/* 思维推理折叠块 */
.coser-detail {
  background: #fffcf8;
  border-radius: 20px;
  margin-bottom: 20px;
  border: 1px solid #e8dfd4;
  overflow: hidden;
}
.coser-detail summary {
  padding: 12px 20px;
  font-weight: 600;
  cursor: pointer;
  list-style: none;
  background: #faf5f0;
  color: #b87c5e;
}
.coser-detail summary::-webkit-details-marker { display: none; }
.coser-detail summary::before { content: '📸'; margin-right: 8px; }
.coser-content {
  padding: 12px 20px;
  line-height: 1.6;
  font-size: 0.9rem;
  border-top: 1px solid #e8dfd4;
  background: #fffcf8;
}

/* 环境描写 */
.coser-env {
  background: #faf5f0;
  border-radius: 60px;
  padding: 10px 20px;
  margin-bottom: 20px;
  font-size: 0.85rem;
  color: #b87c5e;
  text-align: center;
  border: 1px solid #e8dfd4;
}

/* 叙事正文 */
.coser-narrative {
  margin-bottom: 20px;
  text-align: justify;
  font-size: 1rem;
  line-height: 1.8;
  background: rgba(255,252,248,0.6);
  padding: 12px;
  border-radius: 20px;
}

/* 对话气泡 */
.coser-bubble {
  display: flex;
  gap: 12px;
  margin: 16px 0;
  align-items: flex-start;
}
.bubble-avatar {
  width: 44px;
  height: 44px;
  background: #d9cfc2;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  flex-shrink: 0;
}
.bubble-content {
  background: #fffcf8;
  border-radius: 20px 20px 20px 8px;
  padding: 10px 16px;
  max-width: calc(100% - 60px);
  border: 1px solid #e8dfd4;
}
.bubble-name {
  color: #b87c5e;
  font-weight: bold;
  font-size: 0.8rem;
  margin-bottom: 4px;
}
.bubble-text {
  color: #4a3b2c;
  font-size: 0.9rem;
  line-height: 1.5;
}

/* NPC档案面板 - 折叠样式 */
.coser-profile {
  background: #faf5f0;
  border-radius: 20px;
  margin: 20px 0;
  border: 1px solid #e8dfd4;
  overflow: hidden;
}
.coser-profile summary {
  padding: 12px 20px;
  font-weight: 600;
  cursor: pointer;
  list-style: none;
  background: #e8dfd4;
  color: #b87c5e;
  font-size: 0.9rem;
}
.coser-profile summary::-webkit-details-marker { display: none; }
.coser-profile summary::before { content: '📋'; margin-right: 8px; }
.coser-profile[open] summary {
  border-bottom: 1px solid #d9cfc2;
}
.coser-profile markdown {
  display: block;
  font-size: 0.85rem;
  line-height: 1.6;
  color: #4a3b2c;
  white-space: pre-wrap;
  background: #fffcf8;
  padding: 16px;
  margin: 0;
}

/* 状态面板 */
.coser-status {
  background: #fffcf8;
  border: 1px solid #e8dfd4;
  border-radius: 20px;
  padding: 16px;
  margin: 20px 0;
}
.status-title {
  text-align: center;
  color: #b87c5e;
  font-weight: bold;
  margin-bottom: 12px;
  padding-bottom: 6px;
  border-bottom: 1px solid #e8dfd4;
}
.status-row {
  display: flex;
  justify-content: space-between;
  margin-bottom: 8px;
  font-size: 0.85rem;
}
.status-row span:first-child { color: #9e8b78; }
.status-row span:last-child { color: #b87c5e; font-weight: 500; }

/* 选项列表 */
.coser-acts {
  background: #fffcf8;
  border: 1px solid #e8dfd4;
  border-radius: 20px;
  padding: 16px;
  margin-top: 20px;
}
.coser-acts-h {
  color: #b87c5e;
  font-size: 0.85rem;
  font-weight: bold;
  text-align: center;
  margin-bottom: 12px;
  padding-bottom: 6px;
  border-bottom: 1px solid #e8dfd4;
}
.coser-acts-i {
  padding: 8px 0;
  font-size: 0.85rem;
  color: #4a3b2c;
  border-bottom: 1px dashed #e8dfd4;
  cursor: pointer;
  transition: all 0.2s ease;
}
.coser-acts-i:hover {
  color: #b87c5e;
  transform: translateX(4px);
  background: rgba(184,124,94,0.05);
  border-radius: 12px;
  padding-left: 8px;
}
.coser-acts-i:last-child {
  border-bottom: none;
  color: #9e8b78;
  margin-top: 6px;
  border-top: 1px dashed #e8dfd4;
  padding-top: 10px;
}

/* 平台按钮美化 - 浅色系 */
.coser-wrap button,
.coser-wrap .corner-btn,
.coser-wrap .game-enter-btn,
.coser-wrap .back-btn {
  background: linear-gradient(145deg, #d9cfc2, #c8bcab) !important;
  border: none !important;
  color: #4a3b2c !important;
  font-weight: bold !important;
  border-radius: 40px !important;
  padding: 10px 24px !important;
  transition: all 0.2s ease !important;
  box-shadow: 0 2px 6px rgba(0,0,0,0.06) !important;
}
.coser-wrap button:hover,
.coser-wrap .corner-btn:hover,
.coser-wrap .game-enter-btn:hover,
.coser-wrap .back-btn:hover {
  background: linear-gradient(145deg, #c8bcab, #b8a692) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 4px 12px rgba(0,0,0,0.1) !important;
}
.coser-wrap button:active,
.coser-wrap .corner-btn:active,
.coser-wrap .game-enter-btn:active,
.coser-wrap .back-btn:active {
  transform: translateY(1px) !important;
}

/* 响应式 */
@media (max-width: 640px) {
  .coser-wrap { padding: 12px; }
  .bubble-avatar { width: 36px; height: 36px; font-size: 20px; }
  .bubble-content { max-width: calc(100% - 48px); }
  .coser-acts-i { font-size: 0.8rem; padding: 6px 0; }
}

/* ========== 用户提供的全局平台美化（插入部分） ========== */
/* 顶部栏 */
.sticky.w-full.top-0.flex.items-center {
  background: linear-gradient(135deg, #e0f7ff 0%, #f3e5ff 100%) !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08) !important;
  transition: all 0.3s ease !important;
}

/* 模型选择器 */
#ai-model-selector .group.flex.items-center {
  background: linear-gradient(135deg, #fff5e6 0%, #ffe6f0 100%) !important;
  border: 1px solid rgba(255, 182, 193, 0.3) !important;
  border-radius: 12px !important;
  padding: 8px 14px !important;
  transition: all 0.3s ease !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05) !important;
}

#ai-model-selector .group.flex.items-center:hover {
  background: linear-gradient(135deg, #ffe6f0 0%, #fff5e6 100%) !important;
  box-shadow: 0 4px 16px rgba(255, 182, 193, 0.25) !important;
  transform: translateY(-2px) !important;
}

#ai-model-selector .truncate.text-\[13px\] {
  color: #6b4c9a !important;
  font-weight: 600 !important;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

#ai-model-selector .shrink-0.flex.items-center svg {
  color: #9b7ec8 !important;
  transition: transform 0.3s ease !important;
}

#ai-model-selector .group:hover .shrink-0.flex.items-center svg {
  transform: rotate(180deg) !important;
}

/* 历史记录图标 */
.sticky.w-full.top-0 svg.lucide-clock-8 {
  color: #7eb6d4 !important;
  filter: drop-shadow(0 2px 4px rgba(126, 182, 212, 0.3)) !important;
  transition: all 0.3s ease !important;
}

.sticky.w-full.top-0 svg.lucide-clock-8:hover {
  color: #5a9bc4 !important;
  transform: scale(1.15) rotate(15deg) !important;
}

/* 历史记录角标 */
.sticky.w-full.top-0 span.MuiBadge-dot.md\:hidden {
  background: linear-gradient(135deg, #ff6b9d 0%, #ffa07a 100%) !important;
  box-shadow: 0 0 8px rgba(255, 107, 157, 0.6) !important;
}

/* 音乐按钮 */
.sticky.w-full.top-0 button.MuiIconButton-root:has(svg.lucide-music-2) {
  background: linear-gradient(135deg, #d4f1f4 0%, #c3e0ff 100%) !important;
  border-radius: 10px !important;
  transition: all 0.3s ease !important;
}

.sticky.w-full.top-0 button.MuiIconButton-root:has(svg.lucide-music-2):hover {
  background: linear-gradient(135deg, #c3e0ff 0%, #d4f1f4 100%) !important;
  transform: scale(1.1) !important;
  box-shadow: 0 4px 12px rgba(195, 224, 255, 0.4) !important;
}

.sticky.w-full.top-0 button.MuiIconButton-root svg.lucide-music-2 {
  color: #4a90e2 !important;
}

/* 移动端设置图标 */
.sticky.w-full.top-0 svg:has(use[href="#icon-icon-set"]) {
  color: #a8d5ba !important;
  filter: drop-shadow(0 2px 4px rgba(168, 213, 186, 0.3)) !important;
  transition: all 0.3s ease !important;
}

.sticky.w-full.top-0 svg:has(use[href="#icon-icon-set"]):hover {
  color: #7ec49f !important;
  transform: scale(1.15) !important;
}

/* 设置按钮 */
#header-setting-button {
  background: linear-gradient(135deg, #ffeaa7 0%, #ffd89b 100%) !important;
  border-radius: 10px !important;
  padding: 8px 12px !important;
  transition: all 0.3s ease !important;
  box-shadow: 0 2px 8px rgba(255, 216, 155, 0.3) !important;
}

#header-setting-button:hover {
  background: linear-gradient(135deg, #ffd89b 0%, #ffeaa7 100%) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 4px 16px rgba(255, 216, 155, 0.5) !important;
}

#header-setting-button svg {
  color: #d97706 !important;
  transition: transform 0.3s ease !important;
}

#header-setting-button:hover svg {
  transform: rotate(90deg) !important;
}

/* 开场白选择器 */
div.flex.items-center.h-9.bg-white.rounded-md.cursor-pointer.group[class*="border-gray"] {
  background: linear-gradient(135deg, #f0f9ff 0%, #fef3c7 100%) !important;
  border: 1px solid rgba(147, 197, 253, 0.4) !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06) !important;
  transition: all 0.3s ease !important;
}

div.flex.items-center.h-9.bg-white.rounded-md.cursor-pointer.group[class*="border-gray"]:hover {
  background: linear-gradient(135deg, #fef3c7 0%, #f0f9ff 100%) !important;
  box-shadow: 0 4px 12px rgba(147, 197, 253, 0.3) !important;
  transform: translateY(-1px) !important;
}

div.flex.items-center.h-9.cursor-pointer.group svg[data-icon="SlidersH"] {
  color: #3b82f6 !important;
  transition: transform 0.3s ease !important;
}

div.flex.items-center.h-9.cursor-pointer.group:hover svg[data-icon="SlidersH"] {
  transform: translateX(-3px) !important;
}

div.flex.items-center.h-9.cursor-pointer.group svg[data-icon="ChevronDown"] {
  color: #8b5cf6 !important;
  transition: transform 0.3s ease !important;
}

div.flex.items-center.h-9.cursor-pointer.group:hover svg[data-icon="ChevronDown"] {
  transform: rotate(180deg) !important;
}

/* Mod按钮栏 */
#ai-mod-button2 button.MuiButton-root:nth-child(1) {
  background: linear-gradient(135deg, #d4edda 0%, #c3e6cb 100%) !important;
  color: #155724 !important;
  border: 1px solid rgba(40, 167, 69, 0.3) !important;
  border-radius: 10px !important;
  transition: all 0.3s ease !important;
  box-shadow: 0 2px 6px rgba(40, 167, 69, 0.15) !important;
}

#ai-mod-button2 button.MuiButton-root:nth-child(1):hover {
  background: linear-gradient(135deg, #c3e6cb 0%, #d4edda 100%) !important;
  box-shadow: 0 4px 12px rgba(40, 167, 69, 0.3) !important;
  transform: translateY(-2px) !important;
}

#ai-mod-button2 button.MuiButton-root:nth-child(2) {
  background: linear-gradient(135deg, #cfe2ff 0%, #b6d4fe 100%) !important;
  color: #004085 !important;
  border: 1px solid rgba(0, 123, 255, 0.3) !important;
  border-radius: 10px !important;
  transition: all 0.3s ease !important;
  box-shadow: 0 2px 6px rgba(0, 123, 255, 0.15) !important;
}

#ai-mod-button2 button.MuiButton-root:nth-child(2):hover {
  background: linear-gradient(135deg, #b6d4fe 0%, #cfe2ff 100%) !important;
  box-shadow: 0 4px 12px rgba(0, 123, 255, 0.3) !important;
  transform: translateY(-2px) !important;
}

#ai-mod-button2 button.MuiButton-root:nth-child(3) {
  background: linear-gradient(135deg, #fff3cd 0%, #ffe69c 100%) !important;
  color: #856404 !important;
  border: 1px solid rgba(255, 193, 7, 0.3) !important;
  border-radius: 10px !important;
  transition: all 0.3s ease !important;
  box-shadow: 0 2px 6px rgba(255, 193, 7, 0.15) !important;
}

#ai-mod-button2 button.MuiButton-root:nth-child(3):hover {
  background: linear-gradient(135deg, #ffe69c 0%, #fff3cd 100%) !important;
  box-shadow: 0 4px 12px rgba(255, 193, 7, 0.3) !important;
  transform: translateY(-2px) !important;
}

#ai-mod-button2 button.MuiButton-root:nth-child(4) {
  background: linear-gradient(135deg, #f8d7da 0%, #f5c6cb 100%) !important;
  color: #721c24 !important;
  border: 1px solid rgba(220, 53, 69, 0.3) !important;
  border-radius: 10px !important;
  transition: all 0.3s ease !important;
  box-shadow: 0 2px 6px rgba(220, 53, 69, 0.15) !important;
}

#ai-mod-button2 button.MuiButton-root:nth-child(4):hover {
  background: linear-gradient(135deg, #f5c6cb 0%, #f8d7da 100%) !important;
  box-shadow: 0 4px 12px rgba(220, 53, 69, 0.3) !important;
  transform: translateY(-2px) !important;
}

#ai-mod-button2 button.MuiButton-root svg {
  transition: transform 0.3s ease !important;
}

#ai-mod-button2 button.MuiButton-root:hover svg {
  transform: scale(1.2) !important;
}

/* 底部栏 */
.bg-gradient-to-t {
  background: linear-gradient(to top, #ffe5ec 0%, #fff0f3 100%) !important;
}

#ai-chat-bottom-input {
  background: linear-gradient(135deg, #fff5f7 0%, #fffbea 100%) !important;
  border: 2px solid rgba(255, 182, 193, 0.3) !important;
  border-radius: 16px !important;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08) !important;
  transition: all 0.3s ease !important;
}

#ai-chat-bottom-input:hover {
  border-color: rgba(255, 182, 193, 0.6) !important;
  box-shadow: 0 6px 24px rgba(255, 182, 193, 0.2) !important;
}

#ai-chat-input {
  color: #4a4a4a !important;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  transition: all 0.3s ease !important;
}

#ai-chat-input::placeholder {
  color: #b8a9c9 !important;
  font-style: italic !important;
}

#ai-chat-input::selection {
  background: rgba(255, 182, 193, 0.4) !important;
  color: #2d2d2d !important;
}

/* 分页栏 */
.MuiPaginationItem-root {
  background: linear-gradient(135deg, #f0f4f8 0%, #e3f2fd 100%) !important;
  color: #5a7a9b !important;
  border: 1px solid rgba(90, 122, 155, 0.2) !important;
  border-radius: 8px !important;
  transition: all 0.3s ease !important;
  font-weight: 500 !important;
}

.MuiPaginationItem-root:hover {
  background: linear-gradient(135deg, #e3f2fd 0%, #bbdefb 100%) !important;
  color: #3d5a7a !important;
  border-color: rgba(90, 122, 155, 0.4) !important;
}

.MuiPaginationItem-root.Mui-selected {
  background: linear-gradient(135deg, #64b5f6 0%, #42a5f5 100%) !important;
  color: #ffffff !important;
  border-color: rgba(66, 165, 245, 0.6) !important;
}

.MuiPaginationItem-root.Mui-disabled {
  background: linear-gradient(135deg, #f5f5f5 0%, #eeeeee 100%) !important;
  color: #bdbdbd !important;
}

.MuiPaginationItem-icon {
  color: inherit !important;
}

.MuiStack-root.css-1uwir8f {
  background: linear-gradient(135deg, #fef9e7 0%, #fef5e7 100%) !important;
  border-radius: 10px !important;
}

.MuiStack-root.css-1uwir8f .MuiBox-root {
  color: #7d6608 !important;
  font-weight: 600 !important;
}

.MuiInputBase-input {
  background: linear-gradient(135deg, #ffffff 0%, #fffbf0 100%) !important;
  border: 1px solid rgba(125, 102, 8, 0.2) !important;
  border-radius: 6px !important;
  color: #7d6608 !important;
}

/* 评论区 */
div[class*="w-full"][class*="bg-white"][class*="bottom-0"] {
  background: linear-gradient(135deg, #fefcf3 0%, #fff9e6 100%) !important;
  border-top: 2px solid rgba(255, 215, 0, 0.2) !important;
}

div.text-lg.font-bold {
  color: #6b5b3a !important;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.05) !important;
}

p.MuiTypography-body1.text-grey-600 {
  color: #8b7355 !important;
  font-weight: 500 !important;
}

span.MuiRating-root {
  filter: drop-shadow(0 2px 4px rgba(255, 152, 0, 0.2)) !important;
}

span.MuiRating-iconEmpty svg {
  color: #ffe0b2 !important;
}

span.MuiRating-iconFilled svg {
  color: #ff9800 !important;
}

span.text-orange-500 {
  color: #ff9800 !important;
  font-weight: 700 !important;
}

div.flex.flex-col.border-gray-200 {
  background: linear-gradient(135deg, #ffffff 0%, #fffef7 100%) !important;
  border: 2px solid rgba(255, 215, 0, 0.25) !important;
  border-radius: 12px !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05) !important;
}

textarea.rc-textarea {
  color: #4a4a4a !important;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

textarea.rc-textarea::placeholder {
  color: #b8a890 !important;
}

div.bg-gray-100.text-gray-500 {
  background: linear-gradient(135deg, #f9f7f0 0%, #f5f3e8 100%) !important;
  color: #9e8a6a !important;
}

div.cursor-pointer.group.flex.items-center.justify-center {
  background: linear-gradient(135deg, #e8f5e9 0%, #c8e6c9 100%) !important;
  border-radius: 10px !important;
  transition: all 0.3s ease !important;
  box-shadow: 0 2px 6px rgba(76, 175, 80, 0.2) !important;
}

div.cursor-pointer.group.flex.items-center.justify-center:hover {
  background: linear-gradient(135deg, #c8e6c9 0%, #a5d6a7 100%) !important;
  box-shadow: 0 4px 12px rgba(76, 175, 80, 0.35) !important;
  transform: translateY(-2px) !important;
}

div[data-state="closed"] svg[data-icon="Send03"] {
  color: #2e7d32 !important;
  transition: transform 0.3s ease !important;
}

div.cursor-pointer.group:hover svg[data-icon="Send03"] {
  transform: translateX(4px) !important;
}

div.style_divider__mW0YX {
  background: linear-gradient(90deg, transparent 0%, rgba(255, 215, 0, 0.3) 50%, transparent 100%) !important;
}

.MuiStack-root.css-1dmzxoz {
  background: linear-gradient(135deg, #f3f4f6 0%, #e5e7eb 100%) !important;
  border-radius: 10px !important;
}

button.MuiButton-containedPrimary {
  background: linear-gradient(135deg, #8b5cf6 0%, #7c3aed 100%) !important;
  color: #ffffff !important;
  border-radius: 8px !important;
  transition: all 0.3s ease !important;
  box-shadow: 0 2px 8px rgba(139, 92, 246, 0.3) !important;
}

button.MuiButton-containedPrimary:hover {
  background: linear-gradient(135deg, #7c3aed 0%, #6d28d9 100%) !important;
  box-shadow: 0 4px 16px rgba(139, 92, 246, 0.5) !important;
  transform: translateY(-2px) !important;
}

button.MuiButton-outlinedPrimary {
  background: linear-gradient(135deg, #faf5ff 0%, #f3e8ff 100%) !important;
  color: #7c3aed !important;
  border: 1px solid rgba(139, 92, 246, 0.3) !important;
  border-radius: 8px !important;
  transition: all 0.3s ease !important;
}

button.MuiButton-outlinedPrimary:hover {
  background: linear-gradient(135deg, #f3e8ff 0%, #e9d5ff 100%) !important;
  border-color: rgba(139, 92, 246, 0.5) !important;
  transform: translateY(-1px) !important;
}

div.p-3.overflow-y-auto {
  scrollbar-width: thin !important;
  scrollbar-color: rgba(255, 215, 0, 0.3) transparent !important;
}

div.group.ml-0 {
  background: linear-gradient(135deg, #ffffff 0%, #fffef9 100%) !important;
  border-radius: 10px !important;
  transition: all 0.3s ease !important;
}

div.group.ml-0:hover {
  background: linear-gradient(135deg, #fffef9 0%, #fffaed 100%) !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06) !important;
}

div.group img.rounded-full {
  border: 2px solid rgba(255, 215, 0, 0.3) !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1) !important;
  transition: all 0.3s ease !important;
}

div.group:hover img.rounded-full {
  border-color: rgba(255, 215, 0, 0.6) !important;
  transform: scale(1.05) !important;
}

div.text-sm.text-grey-600 span.font-bold {
  color: #6b5b3a !important;
  font-weight: 700 !important;
}

span.text-\[10px\] {
  color: #9e8a6a !important;
  background: linear-gradient(135deg, #fef9e7 0%, #fef5e7 100%) !important;
  border-radius: 4px !important;
}

div.break-all {
  color: #4a4a4a !important;
  line-height: 1.6 !important;
}

div.text-xs.text-grey-600 {
  color: #9e8a6a !important;
}

button.text-gray-400 {
  background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%) !important;
  border-radius: 6px !important;
  transition: all 0.3s ease !important;
}

button.text-gray-400:hover {
  background: linear-gradient(135deg, #fde68a 0%, #fcd34d 100%) !important;
  transform: scale(1.1) !important;
}

button.text-gray-400 svg {
  color: #d97706 !important;
}

span.cursor-pointer {
  color: #7c3aed !important;
  font-weight: 600 !important;
  transition: all 0.3s ease !important;
}

span.cursor-pointer:hover {
  color: #6d28d9 !important;
  text-decoration: underline !important;
}

div.ml-8.border-l {
  border-color: rgba(255, 215, 0, 0.3) !important;
}