/* =============================================
   樱花粉 · 梨花白
   base-hue:340  base-sat:30%  is-dark:0  accent-hue:330  accent-sat:70%

   bg-deep:#fff8fa   bg-default:#fff5f7   bg-paper:#ffffff   bg-raised:#ffe4ef
   bg-hover:#ffd1e3  text-main:#5c1a3a    text-sub:#8b4068   text-muted:rgba(236,72,153,0.30)
   border:rgba(236,72,153,0.15)  accent:#ec4899  accent-dim:rgba(236,72,153,0.08)  accent-text:#db2777
   glow: 0 0 14px rgba(236,72,153,0.15)   glow-soft: 0 0 6px rgba(236,72,153,0.06)

   亮点① blockquote → 左边框线性渐变 + 首行❝引号伪元素 + 微弱粉色 box-shadow
   亮点② 加载动画  → 内嵌SVG SMIL五瓣樱花旋转
   亮点③ 发送按钮  → clip-path樱花五瓣 + hover波纹 + active缩放
   ============================================= */

/* ===== 危险区域 ===== */

/* 1. 隐藏装饰条 */
[class*="bg-[#F1CBCB]"],
[class*="bg-[#c9e1e9]"] {
  display: none !important;
}

/* 2. 代码块 */
.markdown-body pre {
  background: rgba(252,231,243,0.80) !important;
  border: 1px solid rgba(236,72,153,0.18) !important;
  border-left: 3px solid #ec4899 !important;
  border-radius: 6px !important;
  padding: 1em 1.2em !important;
  overflow-x: auto !important;
}
.markdown-body pre code {
  background: transparent !important;
  color: #5c1a3a !important;
}
.markdown-body :not(pre)>code {
  background: rgba(236,72,153,0.08) !important;
  color: #db2777 !important;
  padding: 0.15em 0.45em !important;
  border-radius: 4px !important;
}

/* 3. details折叠块 */
.markdown-body details {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  overflow: hidden !important;
  background: rgba(236,72,153,0.03) !important;
  border: 1px solid rgba(236,72,153,0.12) !important;
  border-radius: 6px !important;
  margin: 8px 0 !important;
  transition: border-color 0.15s !important;
}
.markdown-body details[open] {
  border-color: rgba(236,72,153,0.35) !important;
}
.markdown-body details summary {
  display: block !important;
  width: 100% !important;
  list-style: none !important;
  position: relative !important;
  padding: 8px 12px 8px 32px !important;
  background: rgba(236,72,153,0.06) !important;
  color: #9d174d !important;
  border-bottom: 1px solid rgba(236,72,153,0.12) !important;
  cursor: pointer !important;
  font-weight: 600 !important;
  user-select: none !important;
}
.markdown-body details summary::before {
  content: '\25B6' !important;
  position: absolute !important;
  left: 12px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  color: #ec4899 !important;
  font-size: 11px !important;
  transition: transform 0.2s cubic-bezier(0.34,1.56,0.64,1), color 0.2s !important;
}
.markdown-body details summary:hover::before {
  color: #be185d !important;
}
.markdown-body details[open] summary::before {
  transform: translateY(-50%) rotate(90deg) !important;
}
.markdown-body details summary::-webkit-details-marker {
  display: none !important;
}
.markdown-body details > :not(summary) {
  color: #5c1a3a !important;
}

/* 4. 滚动条 */
::-webkit-scrollbar {
  width: 3px !important;
  height: 3px !important;
}
::-webkit-scrollbar-track {
  background: #fff8fa !important;
}
::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #f9a8d4, #f472b6, #ec4899) !important;
  border-radius: 3px !important;
  transition: box-shadow 0.2s !important;
}
::-webkit-scrollbar-thumb:hover {
  background: #ec4899 !important;
  box-shadow: 0 0 6px rgba(236,72,153,0.5) !important;
}

/* 5. 选区 & 占位符 */
::placeholder {
  color: rgba(236,72,153,0.30) !important;
  opacity: 1 !important;
}
::selection {
  background: rgba(236,72,153,0.08) !important;
  color: #db2777 !important;
}

/* 6. 页面背景 */
body,
html,
#root,
.app-root,
.h-screen {
  background: #fff8fa !important;
  color: #5c1a3a !important;
}

/* ⚠️ 输入框强制可见 */
#ai-chat-input {
  background: rgba(255,255,255,0.95) !important;
  color: #5c1a3a !important;
  caret-color: #ec4899 !important;
}
textarea.rc-textarea {
  background: rgba(255,255,255,0.95) !important;
  color: #5c1a3a !important;
  border: 1px solid rgba(236,72,153,0.20) !important;
}

/* ===== 全局 ===== */
body,
#root,
.h-screen {
  background: #fff8fa !important;
  color: #5c1a3a !important;
}

/* ===== 顶部导航 ===== */
.sticky.w-full.top-0.flex.items-center {
  background: rgba(255,245,247,0.96) !important;
  border-bottom: 1px solid rgba(236,72,153,0.12) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
}

#ai-model-selector .group.flex.items-center {
  background: rgba(236,72,153,0.06) !important;
  border: 1px solid rgba(236,72,153,0.18) !important;
  border-radius: 6px !important;
  color: #5c1a3a !important;
  transition: border-color 0.15s !important;
}
#ai-model-selector .group.flex.items-center:hover {
  border-color: rgba(236,72,153,0.35) !important;
}

#ai-model-selector .truncate.text-\[13px\] {
  color: #ec4899 !important;
}

#ai-model-selector .shrink-0.flex.items-center svg {
  color: #ec4899 !important;
  fill: #ec4899 !important;
}

#header-setting-button {
  color: #be185d !important;
}
#header-setting-button:hover {
  color: #9d174d !important;
}

/* ===== 开场白区域 ===== */
div.flex.items-center.h-9.bg-white.rounded-md.cursor-pointer.group[class*="border-gray"] {
  background: rgba(255,255,255,0.95) !important;
  border-color: rgba(236,72,153,0.18) !important;
  color: #5c1a3a !important;
}
div.flex.items-center.h-9.cursor-pointer.group svg[data-icon="SlidersH"] {
  color: #ec4899 !important;
}
div.flex.items-center.h-9.cursor-pointer.group svg[data-icon="ChevronDown"] {
  color: #ec4899 !important;
}

/* ===== 侧边栏 ===== */
.shadow-lg.border-r.border-gray-200 {
  background: #fff5f7 !important;
  border-right-color: rgba(236,72,153,0.12) !important;
}
.MuiList-root {
  background: transparent !important;
}
.conversation-text {
  color: #5c1a3a !important;
}

/* ===== 功能按钮 ===== */
#ai-mod-button2 {
  background: rgba(255,255,255,0.70) !important;
  border: 1px solid rgba(236,72,153,0.12) !important;
  border-radius: 6px !important;
}
#ai-mod-button2 button.MuiButton-root {
  background: rgba(255,255,255,0.70) !important;
  border: 1px solid rgba(236,72,153,0.12) !important;
  border-radius: 6px !important;
  color: #be185d !important;
  transition: border-color 0.15s, background 0.15s !important;
}
#ai-mod-button2 button.MuiButton-root:hover {
  background: rgba(236,72,153,0.06) !important;
  border-color: rgba(236,72,153,0.30) !important;
}
#ai-mod-button2 button.MuiButton-root svg {
  color: #be185d !important;
  fill: #be185d !important;
}

/* ===== 聊天气泡 ===== */
.bg-gray-100\/90.relative.inline-block {
  background: linear-gradient(135deg, #ffffff, #fff5f7) !important;
  border: 1px solid rgba(236,72,153,0.15) !important;
  border-radius: 8px !important;
  box-shadow: 0 0 0px rgba(236,72,153,0.06) !important;
  padding: 10px 14px !important;
  color: #5c1a3a !important;
}
.bg-gray-100\/90.relative.inline-block:not(.chat-answer-container .bg-gray-100\/90) {
  background: linear-gradient(135deg, #ffffff, #fff5f7) !important;
  border: 1px solid rgba(236,72,153,0.15) !important;
  border-radius: 8px !important;
  box-shadow: 0 0 0px rgba(236,72,153,0.06) !important;
}
.bg-gray-100\/90.relative.inline-block:hover {
  box-shadow: 0 0 14px rgba(236,72,153,0.15) !important;
}

.markdown-body {
  color: #5c1a3a !important;
  font-size: 14px !important;
  line-height: 1.8 !important;
  font-weight: 400 !important;
  letter-spacing: 0.02em !important;
}

.markdown-body h1,
.markdown-body h2,
.markdown-body h3 {
  color: #9d174d !important;
  border-bottom-color: rgba(236,72,153,0.12) !important;
}
.markdown-body h1 {
  font-weight: 700 !important;
}
.markdown-body h2 {
  font-weight: 600 !important;
}
.markdown-body h3 {
  font-weight: 600 !important;
}

.markdown-body ul,
.markdown-body ol {
  color: #5c1a3a !important;
}
.markdown-body li {
  color: #5c1a3a !important;
}
.markdown-body li::marker {
  color: #ec4899 !important;
}

/* 亮点① blockquote 世界观氛围 */
.markdown-body blockquote {
  border-left: 3px solid transparent !important;
  border-image: linear-gradient(180deg, #f9a8d4, #ec4899, #be185d) 1 !important;
  background: rgba(236,72,153,0.04) !important;
  color: #9d174d !important;
  padding: 12px 16px 12px 20px !important;
  margin: 8px 0 !important;
  border-radius: 0 6px 6px 0 !important;
  font-style: italic !important;
  box-shadow: inset 0 0 12px rgba(236,72,153,0.03) !important;
  position: relative !important;
}
.markdown-body blockquote::before {
  content: '❝' !important;
  position: absolute !important;
  top: 4px !important;
  left: 8px !important;
  font-size: 22px !important;
  color: rgba(236,72,153,0.25) !important;
  font-style: normal !important;
  line-height: 1 !important;
}

.markdown-body table {
  border-collapse: collapse !important;
  border: 1px solid rgba(236,72,153,0.15) !important;
}
.markdown-body th {
  background: rgba(236,72,153,0.06) !important;
  color: #9d174d !important;
  border: 1px solid rgba(236,72,153,0.15) !important;
  padding: 6px 10px !important;
}
.markdown-body td {
  border: 1px solid rgba(236,72,153,0.12) !important;
  color: #5c1a3a !important;
  padding: 6px 10px !important;
}

.markdown-body strong {
  color: #831843 !important;
  font-weight: 700 !important;
}
.markdown-body em {
  color: #9d174d !important;
  font-style: italic !important;
}
.markdown-body a {
  color: #ec4899 !important;
  text-decoration: underline !important;
  text-decoration-color: rgba(236,72,153,0.30) !important;
  transition: color 0.15s !important;
}
.markdown-body a:hover {
  color: #be185d !important;
  text-decoration-color: #be185d !important;
}

.markdown-body hr {
  border-color: rgba(236,72,153,0.15) !important;
}

/* ===== 加载动画 ===== */

/* 隐藏默认加载动画 */
.style_dot-flashing__8L91Q.style_text__zGhNq {
  display: none !important;
}

/* 亮点② 樱花旋转加载动画（SVG SMIL内嵌） */
.flex.items-center.justify-center.w-6.h-5 {
  position: relative !important;
  overflow: visible !important;
}
.flex.items-center.justify-center.w-6.h-5::before {
  content: '' !important;
  display: block !important;
  width: 22px !important;
  height: 22px !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Cdefs%3E%3CanimateTransform id='sakura-spin' attributeName='transform' type='rotate' from='0 20 20' to='360 20 20' dur='2.5s' repeatCount='indefinite'/%3E%3C/defs%3E%3Cg%3E%3CanimateTransform attributeName='transform' type='rotate' from='0 20 20' to='360 20 20' dur='2.5s' repeatCount='indefinite'/%3E%3Cpath d='M20 4 C22 10 26 14 20 20 C14 14 18 10 20 4Z' fill='%23f9a8d4' opacity='0.9'/%3E%3Cpath d='M20 4 C22 10 26 14 20 20 C14 14 18 10 20 4Z' fill='%23f472b6' opacity='0.8' transform='rotate(72 20 20)'/%3E%3Cpath d='M20 4 C22 10 26 14 20 20 C14 14 18 10 20 4Z' fill='%23ec4899' opacity='0.7' transform='rotate(144 20 20)'/%3E%3Cpath d='M20 4 C22 10 26 14 20 20 C14 14 18 10 20 4Z' fill='%23f472b6' opacity='0.8' transform='rotate(216 20 20)'/%3E%3Cpath d='M20 4 C22 10 26 14 20 20 C14 14 18 10 20 4Z' fill='%23f9a8d4' opacity='0.9' transform='rotate(288 20 20)'/%3E%3Ccircle cx='20' cy='20' r='2.5' fill='%23fce7f3'/%3E%3C/g%3E%3C/svg%3E") !important;
  background-size: contain !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
}
.flex.items-center.justify-center.w-6.h-5::after {
  content: '' !important;
  display: none !important;
}

/* ===== 底部输入区 ===== */
.bg-gradient-to-t {
  background: linear-gradient(to top, #fff8fa, rgba(255,248,250,0.0)) !important;
}

#ai-chat-bottom-input {
  background: rgba(255,255,255,0.95) !important;
  border: 1px solid rgba(236,72,153,0.20) !important;
  border-radius: 14px !important;
  transition: border-color 0.2s, box-shadow 0.2s !important;
}
#ai-chat-bottom-input:focus-within {
  border-color: rgba(236,72,153,0.50) !important;
  box-shadow: 0 0 8px rgba(236,72,153,0.12) !important;
}

#ai-chat-input {
  background: rgba(255,255,255,0.95) !important;
  color: #5c1a3a !important;
  caret-color: #ec4899 !important;
  border-radius: 14px !important;
}
#ai-chat-input::placeholder {
  color: rgba(236,72,153,0.30) !important;
}
#ai-chat-input::selection {
  background: rgba(236,72,153,0.08) !important;
  color: #db2777 !important;
}

/* 亮点③ 发送按钮 — 樱花形状 + hover波纹 + active缩放 */
#ai-send-button {
  background: linear-gradient(135deg, #be185d, #9d174d) !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 50% !important;
  clip-path: polygon(
    50% 0%,
    63% 30%, 98% 35%,
    72% 58%, 79% 91%,
    50% 72%, 21% 91%,
    28% 58%, 2% 35%,
    37% 30%
  ) !important;
  transition: transform 0.15s cubic-bezier(0.34,1.56,0.64,1), box-shadow 0.15s !important;
  position: relative !important;
  overflow: hidden !important;
}
#ai-send-button:hover {
  transform: scale(1.1) !important;
  box-shadow: 0 0 16px rgba(236,72,153,0.35) !important;
}
#ai-send-button:active {
  transform: scale(0.92) !important;
}
#ai-send-button::after {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background: radial-gradient(circle at center, rgba(255,255,255,0.35) 0%, transparent 70%) !important;
  opacity: 0 !important;
  transition: opacity 0.2s !important;
  border-radius: 50% !important;
}
#ai-send-button:hover::after {
  opacity: 1 !important;
}

/* ===== 评论区 ===== */
div[class*="w-full"][class*="bg-white"][class*="bottom-0"] {
  background: #fff8fa !important;
  border-color: rgba(236,72,153,0.12) !important;
}
div.text-lg.font-bold {
  color: #9d174d !important;
}
p.MuiTypography-body1.text-grey-600 {
  color: #8b4068 !important;
}
span.MuiRating-root {
  color: #ec4899 !important;
}
span.MuiRating-iconEmpty svg {
  color: rgba(236,72,153,0.20) !important;
  fill: rgba(236,72,153,0.20) !important;
}
span.MuiRating-iconFilled svg {
  color: #ec4899 !important;
  fill: #ec4899 !important;
}
span.text-orange-500 {
  color: #ec4899 !important;
}

div.flex.flex-col.border-gray-200 {
  border-color: rgba(236,72,153,0.12) !important;
}
textarea.rc-textarea {
  background: rgba(255,255,255,0.95) !important;
  color: #5c1a3a !important;
  border: 1px solid rgba(236,72,153,0.20) !important;
  border-radius: 8px !important;
}
textarea.rc-textarea:focus {
  border-color: rgba(236,72,153,0.50) !important;
  box-shadow: 0 0 6px rgba(236,72,153,0.10) !important;
}

div.bg-gray-100.text-gray-500 {
  background: rgba(236,72,153,0.04) !important;
  color: #8b4068 !important;
}
div.cursor-pointer.group.flex.items-center.justify-center {
  color: #be185d !important;
}
div[data-state="closed"] svg[data-icon="Send03"] {
  color: #be185d !important;
  fill: #be185d !important;
}

/* 亮点③延伸 — 分隔线装饰 */
div.style_divider__mW0YX {
  background: linear-gradient(90deg, transparent, rgba(236,72,153,0.20), rgba(236,72,153,0.40), rgba(236,72,153,0.20), transparent) !important;
  height: 1px !important;
}

.MuiStack-root.css-1dmzxoz {
  background: transparent !important;
}
button.MuiButton-containedPrimary {
  background: linear-gradient(135deg, #ec4899, #be185d) !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 6px !important;
  box-shadow: 0 2px 8px rgba(236,72,153,0.20) !important;
  transition: box-shadow 0.15s, transform 0.15s !important;
}
button.MuiButton-containedPrimary:hover {
  box-shadow: 0 4px 16px rgba(236,72,153,0.30) !important;
  transform: translateY(-1px) !important;
}
button.MuiButton-outlinedPrimary {
  background: transparent !important;
  color: #be185d !important;
  border: 1px solid rgba(236,72,153,0.30) !important;
  border-radius: 6px !important;
  transition: background 0.15s, border-color 0.15s !important;
}
button.MuiButton-outlinedPrimary:hover {
  background: rgba(236,72,153,0.05) !important;
  border-color: rgba(236,72,153,0.50) !important;
}

div.p-3.overflow-y-auto {
  background: transparent !important;
}
div.group.ml-0 {
  color: #5c1a3a !important;
}
div.group img.rounded-full {
  border: 2px solid rgba(236,72,153,0.20) !important;
}
div.text-sm.text-grey-600 span.font-bold {
  color: #9d174d !important;
}
span.text-\[10px\] {
  color: #8b4068 !important;
}
div.break-all {
  color: #5c1a3a !important;
}
div.text-xs.text-grey-600 {
  color: #8b4068 !important;
}
button.text-gray-400 {
  color: rgba(236,72,153,0.35) !important;
  transition: color 0.15s !important;
}
button.text-gray-400:hover {
  color: #ec4899 !important;
}
button.text-gray-400 svg {
  color: inherit !important;
  fill: currentColor !important;
}
span.cursor-pointer {
  color: #ec4899 !important;
}
div.ml-8.border-l {
  border-left-color: rgba(236,72,153,0.15) !important;
}

/* ===== 分页 ===== */
.MuiPaginationItem-root {
  color: #5c1a3a !important;
  border-color: rgba(236,72,153,0.15) !important;
  transition: background 0.15s, border-color 0.15s !important;
}
.MuiPaginationItem-root:hover {
  background: rgba(236,72,153,0.06) !important;
  border-color: rgba(236,72,153,0.30) !important;
}
.MuiPaginationItem-root.Mui-selected {
  background: linear-gradient(135deg, #ec4899, #be185d) !important;
  color: #ffffff !important;
  border-color: #ec4899 !important;
}
.MuiPaginationItem-root.Mui-disabled {
  color: rgba(236,72,153,0.20) !important;
  opacity: 0.5 !important;
}
.MuiPaginationItem-icon {
  color: #ec4899 !important;
  fill: #ec4899 !important;
}
.MuiStack-root.css-1uwir8f {
  background: transparent !important;
}
.MuiInputBase-input {
  color: #5c1a3a !important;
  background: rgba(255,255,255,0.95) !important;
}

/* ===== MUI 全局 ===== */
.MuiButton-root,
.MuiButton-contained {
  background: linear-gradient(135deg, #ec4899, #be185d) !important;
  color: #ffffff !important;
  border-radius: 6px !important;
  text-transform: none !important;
}
.MuiButton-outlined {
  background: transparent !important;
  color: #be185d !important;
  border: 1px solid rgba(236,72,153,0.30) !important;
  border-radius: 6px !important;
}
.MuiIconButton-root {
  color: #be185d !important;
  transition: color 0.15s !important;
}
.MuiIconButton-root:hover {
  color: #9d174d !important;
  background: rgba(236,72,153,0.06) !important;
}
.MuiDialog-paper {
  background: #fff8fa !important;
  color: #5c1a3a !important;
  border: 1px solid rgba(236,72,153,0.15) !important;
}
.MuiDrawer-paper {
  background: #fff5f7 !important;
  color: #5c1a3a !important;
  border-right-color: rgba(236,72,153,0.12) !important;
}
.MuiBackdrop-root {
  background: rgba(157,23,77,0.15) !important;
}
.MuiDivider-root {
  border-color: rgba(236,72,153,0.12) !important;
}
.MuiTypography-root {
  color: #5c1a3a !important;
}
.MuiRating-icon {
  color: #ec4899 !important;
}
.MuiOutlinedInput-root {
  color: #5c1a3a !important;
  background: rgba(255,255,255,0.95) !important;
}
.MuiOutlinedInput-notchedOutline {
  border-color: rgba(236,72,153,0.20) !important;
}
.MuiOutlinedInput-root:hover .MuiOutlinedInput-notchedOutline {
  border-color: rgba(236,72,153,0.40) !important;
}
.MuiOutlinedInput-root.Mui-focused .MuiOutlinedInput-notchedOutline {
  border-color: #ec4899 !important;
  box-shadow: 0 0 6px rgba(236,72,153,0.12) !important;
}
.MuiTouchRipple-root {
  color: rgba(236,72,153,0.20) !important;
}
.MuiTypography-root.MuiTypography-body2.css-6c0gf2 {
  color: #8b4068 !important;
}
.MuiButtonBase-root.MuiButton-root.MuiButton-text.MuiButton-textPrimary {
  color: #be185d !important;
}
.MuiButtonBase-root.MuiButton-root.MuiButton-text.MuiButton-textPrimary:hover {
  background: rgba(236,72,153,0.06) !important;
}
.text-orange-500 {
  color: #ec4899 !important;
}

/* ===== 响应式 ===== */
@media (max-width: 480px) {
  .bg-gray-100\/90.relative.inline-block {
    padding: 8px 10px !important;
    border-radius: 6px !important;
  }
  .markdown-body {
    font-size: 13.5px !important;
  }
  #ai-chat-bottom-input {
    border-radius: 12px !important;
  }
  #ai-send-button {
    clip-path: polygon(
      50% 0%,
      63% 30%, 98% 35%,
      72% 58%, 79% 91%,
      50% 72%, 21% 91%,
      28% 58%, 2% 35%,
      37% 30%
    ) !important;
  }
}

/* ===== 降速兜底 ===== */
@media (prefers-reduced-motion: reduce) {
  .flex.items-center.justify-center.w-6.h-5::before,
  .flex.items-center.justify-center.w-6.h-5::after {
    animation-duration: 4s !important;
  }
  #ai-send-button,
  #ai-send-button::after,
  .markdown-body details summary::before,
  .MuiButton-root,
  button.MuiButton-containedPrimary,
  button.MuiButton-outlinedPrimary {
    transition-duration: 0.01s !important;
  }
}