/* ========================================
   === 平台聊天框美化层（基础） ===
   ======================================== */
.bg-gray-100\/90.relative.inline-block{
  position: relative !important;
  background: linear-gradient(135deg, #fbfaf7 0%, #f5f1fb 100%) !important;
  border: 1px solid rgba(139,123,168,0.18) !important;
  border-radius: 18px !important;
  box-shadow: 0 6px 20px rgba(139,123,168,0.08) !important;
  overflow: hidden !important;
  isolation: isolate !important;
}
.bg-gray-100\/90.relative.inline-block::before{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  background:
    radial-gradient(circle at top left, rgba(255,192,211,0.20), transparent 35%),
    radial-gradient(circle at bottom right, rgba(139,123,168,0.14), transparent 40%) !important;
  z-index:0 !important;
  pointer-events:none !important;
}
.bg-gray-100\/90.relative.inline-block::after{
  content:"" !important;
  position:absolute !important;
  left:0 !important;
  right:0 !important;
  top:0 !important;
  height:3px !important;
  background: linear-gradient(90deg, #ffc0d3 0%, #8b7ba8 50%, #ffc0d3 100%) !important;
  z-index:1 !important;
  pointer-events:none !important;
}
.markdown-body{
  position: relative !important;
  z-index: 1 !important;
  background: transparent !important;
  color: #404040 !important;
  font-weight: 500 !important;
  line-height: 1.75 !important;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif !important;
}
.markdown-body p{
  margin: 0 0 0.9em 0 !important;
}
.markdown-body strong{
  color: #6f5b8d !important;
  font-weight: 700 !important;
}
.MuiButtonBase-root.MuiButton-root.MuiButton-text.MuiButton-textPrimary,
.MuiTypography-root.MuiTypography-body2.css-6c0gf2,
.text-orange-500{
  color: #7b6a98 !important;
  font-weight: 600 !important;
}
[class*="bg-[#F1CBCB]"],
[class*="bg-[#c9e1e9]"]{
  display: none !important;
}
.flex.items-center.justify-center.w-6.h-5{
  position: relative !important;
}
.flex.items-center.justify-center.w-6.h-5 .style_dot-flashing__8L91Q.style_text__zGhNq{
  display: none !important;
}
/* ========================================
   === 内容模板皮肤层（ai 标签） ===
   ======================================== */
ai{
  --jade: #faf9f6;
  --violet: #8b7ba8;
  --violet-deep: #6b5b88;
  --pink-shy: #ffc0d3;
  --pink-wet: #ffb3d9;
  --text: #4a4a4a;
  --text-light: #888;
  --divider: #e8e4f0;
  display: block;
  max-width: 100%;
  padding: 12px;
  background: var(--jade);
  color: var(--text);
  font-size: 15px;
  line-height: 1.6;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
}
ai .scene{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 10px 12px;
  background: linear-gradient(135deg, var(--jade) 0%, #f5f3fa 100%);
  border-left: 3px solid var(--violet);
  border-radius: 6px;
  margin-bottom: 12px;
  font-size: 14px;
}
ai .scene span{
  padding: 4px 8px;
  background: rgba(139, 123, 168, 0.08);
  border-radius: 4px;
  color: var(--violet-deep);
}
ai .scene .warn{
  background: rgba(255, 192, 211, 0.15);
  color: #d5577e;
  font-weight: 500;
}
ai .rev-main{
  padding: 16px 14px;
  background: var(--jade);
  border-radius: 8px;
  margin-bottom: 14px;
  box-shadow: 0 2px 8px rgba(139, 123, 168, 0.06);
}
ai .rev-main p{
  margin: 0 0 12px 0;
  text-indent: 2em;
  color: var(--text);
}
ai .rev-main p:last-child{
  margin-bottom: 0;
}
ai .cu{
  display: block;
  position: relative;
  padding: 16px 14px;
  margin: 14px 0;
  background: linear-gradient(135deg, #fff5f8 0%, #ffeef5 100%);
  border-radius: 6px;
  color: #c75b8a;
  font-style: italic;
  font-size: 14px;
  text-indent: 0;
}
ai .cu::before,
ai .cu::after{
  content: '';
  position: absolute;
  width: 20px;
  height: 20px;
  border: 2px solid var(--pink-shy);
}
ai .cu::before{
  top: 6px;
  left: 6px;
  border-right: none;
  border-bottom: none;
}
ai .cu::after{
  bottom: 6px;
  right: 6px;
  border-left: none;
  border-top: none;
}
ai .twt{
  background: #fff;
  border: 1px solid #e1e8ed;
  border-radius: 12px;
  padding: 14px;
  margin: 14px 0;
  box-shadow: 0 1px 3px rgba(0,0,0,0.08);
}
ai .t-hd{
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 10px;
}
ai .t-avt{
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: linear-gradient(135deg, #ddd 0%, #bbb 100%);
  flex-shrink: 0;
}
ai .t-hd b{
  font-size: 15px;
  color: #14171a;
  font-weight: 600;
}
ai .t-hd span{
  font-size: 14px;
  color: #657786;
}
ai .t-bd{
  font-size: 15px;
  color: #14171a;
  line-height: 1.5;
  margin-bottom: 10px;
}
ai .t-dt{
  font-size: 13px;
  color: #657786;
  margin-bottom: 10px;
}
ai .t-sts{
  display: flex;
  gap: 16px;
  padding: 8px 0;
  border-top: 1px solid #e1e8ed;
  border-bottom: 1px solid #e1e8ed;
  margin-bottom: 10px;
}
ai .t-sts span{
  font-size: 13px;
  color: #657786;
}
ai .t-cmts{
  display: flex;
  flex-direction: column;
  gap: 8px;
}
ai .t-c{
  padding: 8px 10px;
  background: #f7f9fa;
  border-radius: 8px;
  font-size: 14px;
  color: #14171a;
  line-height: 1.4;
}
ai .t-c b{
  color: #1da1f2;
  font-weight: 500;
}
ai .pnl{
  background: linear-gradient(135deg, #fefefe 0%, #faf9f6 100%);
  border: 1px solid var(--divider);
  border-left: 3px solid var(--violet);
  border-radius: 8px;
  padding: 0;
  margin-bottom: 12px;
  box-shadow: 0 2px 6px rgba(139, 123, 168, 0.08);
}
ai .pnl summary{
  padding: 12px 14px;
  font-weight: 600;
  color: var(--violet-deep);
  cursor: pointer;
  user-select: none;
  list-style: none;
}
ai .pnl summary::-webkit-details-marker{
  display: none;
}
ai .pnl[open] summary{
  border-bottom: 1px solid var(--divider);
}
ai .thk{
  background: linear-gradient(135deg, #f9f8fd 0%, #f3f1f8 100%);
  border-left-color: var(--violet-deep);
}
ai .bhh{
  border-left-color: var(--pink-shy);
  box-shadow: 0 0 12px rgba(255, 192, 211, 0.15);
}
ai .pnl summary:has(+ *){
  position: relative;
}
ai details:has(.p-grp) summary::after{
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 2px;
  background: linear-gradient(90deg, transparent 0%, var(--pink-shy) 50%, transparent 100%);
  opacity: 0.4;
}
ai .p-grp{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 8px;
  padding: 12px 14px;
}
ai .p-grp d{
  display: block;
  padding: 6px 10px;
  background: rgba(139, 123, 168, 0.05);
  border-radius: 4px;
  font-size: 14px;
  color: var(--text);
  line-height: 1.4;
}
ai .p-grp d.fw{
  grid-column: 1 / -1;
}
ai .p-tit{
  padding: 8px 14px 4px;
  font-size: 13px;
  font-weight: 600;
  color: var(--violet);
  border-top: 1px dashed var(--divider);
}
ai .mem{
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 12px 14px;
}
ai .mem m{
  display: grid;
  grid-template-columns: 30px 80px 1fr;
  gap: 8px;
  padding: 10px;
  background: rgba(139, 123, 168, 0.04);
  border-left: 2px solid var(--violet);
  border-radius: 4px;
  font-size: 13px;
  align-items: start;
}
ai .mem m i{
  font-style: normal;
  font-weight: 600;
  color: var(--violet);
}
ai .mem m b{
  font-weight: 500;
  color: var(--text-light);
}
ai .mem m span{
  color: var(--violet-deep);
  font-weight: 500;
}
ai .mem m p{
  grid-column: 1 / -1;
  margin: 4px 0 0 0;
  padding-top: 6px;
  border-top: 1px dashed var(--divider);
  color: var(--text);
  line-height: 1.5;
  text-indent: 0;
}
ai hr{
  border: none;
  height: 1px;
  background: linear-gradient(90deg, transparent 0%, var(--divider) 50%, transparent 100%);
  margin: 14px 0;
}
/* ========================================
   === 选项面板美化 ===
   ======================================== */
ai .opt-panel{
  display: block;
  margin-top: 16px;
  padding: 14px;
  background: linear-gradient(135deg, #fefefe 0%, #f9f7fc 100%);
  border: 1px solid var(--divider);
  border-radius: 10px;
  box-shadow: 0 3px 10px rgba(139, 123, 168, 0.12);
}
ai .opt-title{
  font-size: 15px;
  font-weight: 600;
  color: var(--violet-deep);
  margin-bottom: 12px;
  padding-bottom: 8px;
  border-bottom: 2px solid var(--divider);
  text-align: center;
}
ai .opt{
  display: block;
  padding: 12px 14px;
  margin-bottom: 8px;
  background: linear-gradient(135deg, #fff 0%, #faf9f6 100%);
  border: 1px solid var(--divider);
  border-left: 3px solid var(--violet);
  border-radius: 6px;
  color: var(--text);
  font-size: 14px;
  line-height: 1.5;
  cursor: pointer;
  transition: all 0.3s ease;
  position: relative;
  overflow: hidden;
}
ai .opt:last-child{
  margin-bottom: 0;
}
ai .opt::before{
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 0;
  background: linear-gradient(90deg, rgba(139, 123, 168, 0.08) 0%, transparent 100%);
  transition: width 0.3s ease;
  z-index: 0;
}
ai .opt:hover::before{
  width: 100%;
}
ai .opt:hover{
  border-left-width: 4px;
  transform: translateX(2px);
  box-shadow: 0 2px 8px rgba(139, 123, 168, 0.15);
}
ai .o1{
  border-left-color: #8b7ba8;
}
ai .o1:hover{
  border-left-color: #6b5b88;
  background: linear-gradient(135deg, #f9f8fd 0%, #f3f1f8 100%);
}
ai .o2{
  border-left-color: #1da1f2;
}
ai .o2:hover{
  border-left-color: #0d8bd9;
  background: linear-gradient(135deg, #f0f8ff 0%, #e6f3ff 100%);
}
ai .o3{
  border-left-color: #ff69b4;
  background: linear-gradient(135deg, #fff5f8 0%, #ffeef5 100%);
}
ai .o3::after{
  content: '💗';
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 16px;
  opacity: 0.6;
  animation: heartbeat 1.5s ease-in-out infinite;
}
ai .o3:hover{
  border-left-color: #ff1493;
  background: linear-gradient(135deg, #ffe4f0 0%, #ffd4e8 100%);
  box-shadow: 0 3px 12px rgba(255, 105, 180, 0.25);
}
ai .o4{
  border-left-color: #7cb342;
}
ai .o4:hover{
  border-left-color: #5a9216;
  background: linear-gradient(135deg, #f1f8e9 0%, #e8f5e0 100%);
}
ai .o5{
  border-left-color: transparent;
  background: linear-gradient(135deg, #ffc0d3 0%, #8b7ba8 100%);
  color: #fff;
  font-weight: 600;
  text-align: center;
  border: 2px solid transparent;
  background-clip: padding-box;
  position: relative;
}
ai .o5::before{
  content: '';
  position: absolute;
  inset: -2px;
  background: linear-gradient(135deg, #ffc0d3 0%, #8b7ba8 100%);
  border-radius: 6px;
  z-index: -1;
}
ai .o5:hover{
  transform: translateX(0) scale(1.02);
  box-shadow: 0 4px 16px rgba(139, 123, 168, 0.3);
  background: linear-gradient(135deg, #ffb3d9 0%, #7b6a98 100%);
}
/* ========================================
   === 调教模式覆写层 ===
   ======================================== */
ai.m-train{
  --jade: #fff0f5;
  --violet: #9d4edd;
  --violet-deep: #7b2cbf;
  --pink-shy: #ff69b4;
  --pink-wet: #ff1493;
  --divider: #ffc0d3;
  background: linear-gradient(135deg, #fff5f8 0%, #ffe4f0 100%);
}
ai.m-train .scene{
  background: linear-gradient(135deg, #ffe4f0 0%, #ffd4e8 100%);
  border-left-color: var(--pink-wet);
}
ai.m-train .scene span{
  background: rgba(255, 105, 180, 0.15);
  color: var(--violet-deep);
}
ai.m-train .rev-main{
  background: linear-gradient(135deg, #fff8fb 0%, #ffebf5 100%);
  box-shadow: 0 4px 12px rgba(255, 105, 180, 0.2);
}
ai.m-train .cu{
  background: linear-gradient(135deg, #ffe4f0 0%, #ffd4e8 100%);
  color: #d5006d;
  border-left: 3px solid var(--pink-wet);
}
ai.m-train .cu::before,
ai.m-train .cu::after{
  border-color: var(--pink-wet);
  animation: focus-lock 1.5s ease-in-out infinite;
}
ai.m-train .twt{
  background: #1a1625;
  border-color: #3d2f52;
}
ai.m-train .t-hd b{
  color: #fff;
}
ai.m-train .t-hd span{
  color: #b8a3d1;
}
ai.m-train .t-bd{
  color: #e8dff5;
}
ai.m-train .t-dt{
  color: #b8a3d1;
}
ai.m-train .t-sts{
  border-color: #3d2f52;
}
ai.m-train .t-sts span{
  color: #b8a3d1;
}
ai.m-train .t-c{
  background: #2a1f3a;
  color: #e8dff5;
}
ai.m-train .t-c b{
  color: var(--pink-shy);
}
ai.m-train .pnl{
  background: linear-gradient(135deg, #fff8fb 0%, #ffebf5 100%);
  border-left-width: 4px;
  border-left-color: var(--pink-wet);
  box-shadow: 0 4px 12px rgba(255, 105, 180, 0.25), inset 0 -2px 8px rgba(255, 20, 147, 0.1);
}
ai.m-train .pnl summary{
  color: var(--violet-deep);
}
ai.m-train .trn-pnl{
  border-left-color: var(--pink-wet);
  box-shadow: 0 0 20px rgba(255, 20, 147, 0.3);
}
ai.m-train .task::before{
  content: '💗 ';
  font-size: 16px;
  animation: heartbeat 1.2s ease-in-out infinite;
}
ai.m-train .mem m{
  background: rgba(255, 105, 180, 0.08);
  border-left-color: var(--pink-wet);
}
ai.m-train .mem m i{
  color: var(--pink-wet);
}
ai.m-train .opt-panel{
  background: linear-gradient(135deg, #ffe4f0 0%, #ffd4e8 100%);
  border-color: var(--pink-wet);
  box-shadow: 0 4px 14px rgba(255, 20, 147, 0.2);
}
ai.m-train .opt-title{
  color: var(--violet-deep);
  border-bottom-color: var(--pink-wet);
}
ai.m-train .opt{
  background: linear-gradient(135deg, #fff8fb 0%, #ffebf5 100%);
  border-color: var(--pink-wet);
}
ai.m-train .opt::before{
  background: linear-gradient(90deg, rgba(255, 20, 147, 0.12) 0%, transparent 100%);
}
ai.m-train .opt:hover{
  box-shadow: 0 3px 12px rgba(255, 20, 147, 0.25);
}
ai.m-train .o1{
  border-left-color: var(--violet);
}
ai.m-train .o1:hover{
  border-left-color: var(--violet-deep);
  background: linear-gradient(135deg, #f3e5f5 0%, #e1bee7 100%);
}
ai.m-train .o2{
  border-left-color: #1da1f2;
}
ai.m-train .o2:hover{
  background: linear-gradient(135deg, #e3f2fd 0%, #bbdefb 100%);
}
ai.m-train .o3{
  border-left-color: var(--pink-wet);
  background: linear-gradient(135deg, #ffe4f0 0%, #ffd4e8 100%);
  box-shadow: 0 0 12px rgba(255, 20, 147, 0.2);
}
ai.m-train .o3:hover{
  background: linear-gradient(135deg, #ffd4e8 0%, #ffc0d3 100%);
  box-shadow: 0 4px 16px rgba(255, 20, 147, 0.35);
}
ai.m-train .o4{
  border-left-color: #7cb342;
}
ai.m-train .o4:hover{
  background: linear-gradient(135deg, #f1f8e9 0%, #dcedc8 100%);
}
ai.m-train .o5{
  background: linear-gradient(135deg, #ff1493 0%, #9d4edd 100%);
  box-shadow: 0 4px 14px rgba(255, 20, 147, 0.3);
}
ai.m-train .o5::before{
  background: linear-gradient(135deg, #ff1493 0%, #9d4edd 100%);
}
ai.m-train .o5:hover{
  background: linear-gradient(135deg, #ff69b4 0%, #b565f5 100%);
  box-shadow: 0 6px 20px rgba(255, 20, 147, 0.45);
}
/* ========================================
   === 全局动画定义 ===
   ======================================== */
@keyframes focus-lock{
  0%, 100%{ opacity: 1; }
  50%{ opacity: 0.4; }
}
@keyframes heartbeat{
  0%, 100%{ transform: scale(1); }
  50%{ transform: scale(1.15); }
}
/* ========================================
   === 移动端适配 ===
   ======================================== */
@media (max-width: 480px){
  .bg-gray-100\/90.relative.inline-block{
    border-radius: 14px !important;
    box-shadow: 0 4px 14px rgba(139,123,168,0.08) !important;
  }
  .markdown-body{
    line-height: 1.7 !important;
    font-size: 14px !important;
  }
  ai{
    padding: 10px;
    font-size: 14px;
  }
  ai .scene{
    padding: 8px 10px;
    gap: 6px;
  }
  ai .rev-main{
    padding: 12px 10px;
  }
  ai .pnl{
    margin-bottom: 10px;
  }
  ai .pnl summary{
    padding: 10px 12px;
  }
  ai .p-grp{
    grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
    padding: 10px 12px;
  }
  ai .mem{
    padding: 10px 12px;
  }
  ai .mem m{
    grid-template-columns: 25px 70px 1fr;
    padding: 8px;
  }
  ai .opt-panel{
    padding: 12px;
    margin-top: 12px;
  }
  ai .opt-title{
    font-size: 14px;
    margin-bottom: 10px;
  }
  ai .opt{
    padding: 10px 12px;
    font-size: 13px;
    margin-bottom: 6px;
  }
  ai .o3::after{
    font-size: 14px;
    right: 10px;
  }
}
@media (prefers-reduced-motion: reduce){
  .bg-gray-100\/90.relative.inline-block::before{
    opacity: 0.85 !important;
  }
  ai.m-train .cu::before,
  ai.m-train .cu::after,
  ai.m-train .task::before,
  ai .o3::after{
    animation: none !important;
  }
  ai .opt{
    transition: none !important;
  }
  ai .opt::before{
    transition: none !important;
  }
}
/* 对话颜色区分 - 简化版 */
ai .rev-main p .fg,
.markdown-body p .fg {
  color: #ff69b4 !important;
  font-weight: 600 !important;
}
ai .rev-main p .ug,
.markdown-body p .ug {
  color: #4a9eff !important;
  font-weight: 600 !important;
}