cot {
    display: none;
}

.akashic-btn {
  margin: 12px 0;
  border-radius: 8px;
  overflow: hidden;
}

.akashic-btn > summary {
  display: block;
  width: 100%;
  padding: 12px 0;
  text-align: center;
  cursor: pointer;
  list-style: none;
  border: 1px solid rgba(212, 175, 55, 0.5);
  border-radius: 8px;
  background: linear-gradient(135deg, rgba(15, 0, 10, 0.92), rgba(45, 0, 30, 0.92), rgba(20, 0, 15, 0.92));
  box-shadow:
    0 0 10px rgba(255, 105, 180, 0.15),
    0 0 20px rgba(212, 175, 55, 0.08),
    inset 0 1px 0 rgba(212, 175, 55, 0.15),
    inset 0 0 20px rgba(255, 105, 180, 0.04);
  letter-spacing: 3px;
  font-size: 1.05em;
  color: rgba(212, 175, 55, 0.9);
  text-shadow: 0 0 8px rgba(212, 175, 55, 0.3);
  transition: all 0.4s ease;
  animation: akashic-breathe 4s ease-in-out infinite;
  position: relative;
}

.akashic-btn > summary::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(212, 175, 55, 0.6), transparent);
}

.akashic-btn > summary::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255, 105, 180, 0.4), transparent);
}

.akashic-btn > summary:hover {
  border-color: rgba(212, 175, 55, 0.8);
  box-shadow:
    0 0 15px rgba(255, 105, 180, 0.25),
    0 0 30px rgba(212, 175, 55, 0.15),
    inset 0 1px 0 rgba(212, 175, 55, 0.25),
    inset 0 0 30px rgba(255, 105, 180, 0.06);
  text-shadow: 0 0 12px rgba(212, 175, 55, 0.5);
  color: rgba(212, 175, 55, 1);
}

.akashic-btn > summary::-webkit-details-marker {
  display: none;
}

.akashic-btn > summary::marker {
  display: none;
  content: "";
}

.akashic-inner {
  margin: 8px 4px;
  border-radius: 6px;
  overflow: hidden;
}

.akashic-inner > summary {
  display: block;
  width: 100%;
  padding: 9px 0;
  text-align: center;
  cursor: pointer;
  list-style: none;
  border: 1px solid rgba(212, 175, 55, 0.3);
  border-radius: 6px;
  background: linear-gradient(135deg, rgba(10, 0, 8, 0.8), rgba(30, 0, 20, 0.8));
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  box-shadow:
    0 0 6px rgba(255, 105, 180, 0.1),
    inset 0 1px 0 rgba(212, 175, 55, 0.1),
    inset 0 0 15px rgba(255, 105, 180, 0.03);
  letter-spacing: 1.5px;
  font-size: 0.95em;
  color: rgba(255, 182, 213, 0.85);
  text-shadow: 0 0 6px rgba(255, 105, 180, 0.2);
  transition: all 0.35s ease;
  position: relative;
}

.akashic-inner > summary::before {
  content: "";
  position: absolute;
  top: 0;
  left: 10%;
  right: 10%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(212, 175, 55, 0.35), transparent);
}

.akashic-inner > summary:hover {
  border-color: rgba(212, 175, 55, 0.55);
  box-shadow:
    0 0 12px rgba(255, 105, 180, 0.2),
    inset 0 1px 0 rgba(212, 175, 55, 0.2),
    inset 0 0 20px rgba(255, 105, 180, 0.05);
  color: rgba(255, 182, 213, 1);
  text-shadow: 0 0 10px rgba(255, 105, 180, 0.35);
}

.akashic-inner > summary::-webkit-details-marker {
  display: none;
}

.akashic-inner > summary::marker {
  display: none;
  content: "";
}

.akashic-inner > p {
  margin: 2px 8px;
  padding: 2px 0;
  font-size: 0.88em;
  color: rgba(200, 170, 190, 0.8);
  line-height: 1.6;
}

.akashic-inner table {
  width: 100%;
  border-collapse: collapse;
  margin: 6px 0;
  font-size: 0.85em;
}

.akashic-inner th {
  padding: 6px 8px;
  text-align: left;
  border-bottom: 1px solid rgba(212, 175, 55, 0.35);
  color: rgba(212, 175, 55, 0.85);
  font-weight: normal;
  letter-spacing: 0.5px;
  background: rgba(20, 0, 15, 0.5);
}

.akashic-inner td {
  padding: 5px 8px;
  text-align: left;
  border-bottom: 1px solid rgba(255, 105, 180, 0.08);
  color: rgba(210, 185, 200, 0.8);
  line-height: 1.5;
}

.akashic-inner tr:hover td {
  background: rgba(255, 105, 180, 0.03);
  color: rgba(220, 195, 210, 0.95);
}

.akashic-inner hr {
  border: none;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(212, 175, 55, 0.3), rgba(255, 105, 180, 0.2), transparent);
  margin: 10px 0;
}

@keyframes akashic-breathe {
  0%, 100% {
    box-shadow:
      0 0 10px rgba(255, 105, 180, 0.15),
      0 0 20px rgba(212, 175, 55, 0.08),
      inset 0 1px 0 rgba(212, 175, 55, 0.15),
      inset 0 0 20px rgba(255, 105, 180, 0.04);
  }
  50% {
    box-shadow:
      0 0 14px rgba(255, 105, 180, 0.22),
      0 0 28px rgba(212, 175, 55, 0.12),
      inset 0 1px 0 rgba(212, 175, 55, 0.2),
      inset 0 0 25px rgba(255, 105, 180, 0.06);
  }
}


.girl-sub {
  font-size: 0.78em;
  color: #999;
  text-align: center;
  font-style: italic;
}

.girl-card[data-type="nona"] .girl-sub { color: #7ba7d9; }
.girl-card[data-type="kuma"] .girl-sub { color: #d98aab; }
.girl-card[data-type="mota"] .girl-sub { color: #b08ad9; }

.girl-card.locked[data-type="nona"] {
  background: linear-gradient(135deg, rgba(135, 180, 255, 0.05), rgba(180, 210, 255, 0.08));
  border-color: rgba(100, 150, 230, 0.25);
  border-style: dashed;
  opacity: 0.7;
}

.girl-card.locked[data-type="kuma"] {
  background: linear-gradient(135deg, rgba(200, 130, 170, 0.05), rgba(220, 160, 190, 0.08));
  border-color: rgba(200, 120, 160, 0.25);
  border-style: dashed;
  opacity: 0.7;
}

.girl-card.locked[data-type="mota"] {
  background: linear-gradient(135deg, rgba(180, 160, 220, 0.05), rgba(200, 180, 240, 0.08));
  border-color: rgba(160, 130, 210, 0.25);
  border-style: dashed;
  opacity: 0.7;
}

/* ===== 顶部HUD ===== */
.top-hud {
  background: rgba(180, 100, 140, 0.08);
  border: 1px solid rgba(180, 100, 140, 0.28);
  border-radius: 12px;
  padding: 10px 12px;
  margin-bottom: 10px;
  backdrop-filter: blur(6px);
}

.hud-line {
  display: flex;
  justify-content: space-between;
  font-size: 0.85em;
  color: #d9b3c7;
  padding-bottom: 8px;
  border-bottom: 1px dashed rgba(180, 100, 140, 0.3);
  margin-bottom: 8px;
  flex-wrap: wrap;
  gap: 4px;
}

.hud-bars {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.hud-bar {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 0.85em;
}

.hud-lbl {
  min-width: 55px;
  font-weight: bold;
  white-space: nowrap;
  color: #d9b3c7;
}

.hud-track {
  flex: 1;
  height: 10px;
  background: rgba(255, 255, 255, 0.06);
  border-radius: 5px;
  overflow: hidden;
}

.hud-fill {
  height: 100%;
  border-radius: 5px;
  transition: width 0.5s ease;
}

.san-color { background: linear-gradient(90deg, #c74b7a, #e84393); }
.s-color { background: linear-gradient(90deg, #4a69bd, #6a89dd); }
.m-color { background: linear-gradient(90deg, #d63384, #e84393); }
.hunger-color { background: linear-gradient(90deg, #d4a054, #e8b864); }

.hud-num {
  min-width: 65px;
  text-align: right;
  font-size: 0.9em;
  color: #c8b8d4;
  font-weight: 500;
}

.hunger-warn {
  color: #ff6b4a;
  font-weight: bold;
  font-size: 0.88em;
  animation: hungerPulse 1.5s infinite;
}

/* ===== 正文 ===== */
.story {
  border-left: 4px solid #c74b7a;
  background: rgba(255, 255, 255, 0.04);
  border-radius: 12px;
  padding: 10px 12px;
  margin-bottom: 10px;
  line-height: 1.85;
  font-size: 1.02em;
  color: #E0D4E8;
  min-height: 120px;
}

.story p {
  margin: 0 0 0.8em 0;
  text-indent: 2em;
}

/* ===== 主UI容器 ===== */
.main-ui {
  margin-bottom: 10px;
}

/* ===== 眼球卡片行 ===== */
.girls-row {
  display: flex;
  gap: 8px;
  margin-bottom: 10px;
}

.girl-card {
  flex: 1;
  border-radius: 10px;
  border: 1px solid rgba(180, 100, 140, 0.3);
  background: rgba(255, 255, 255, 0.05);
  overflow: hidden;
  transition: all 0.3s ease;
}

.girl-card summary {
  list-style: none;
  cursor: pointer;
  padding: 8px 10px;
}

.girl-card summary::-webkit-details-marker { display: none; }

.girl-brief {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 5px;
}

.girl-name {
  font-weight: bold;
  font-size: 0.85em;
  text-align: center;
  letter-spacing: 0.5px;
}

.girl-sub {
  font-size: 0.78em;
  color: #b0a0b8;
  text-align: center;
  font-style: italic;
}

.girl-card[data-type="nona"] .girl-sub { color: #8dbde8; }
.girl-card[data-type="kuma"] .girl-sub { color: #e8a0c0; }
.girl-card[data-type="mota"] .girl-sub { color: #c4a0e8; }

.mini-bar {
  width: 100%;
  height: 5px;
  background: rgba(255, 255, 255, 0.06);
  border-radius: 3px;
  overflow: hidden;
}

.mini-bar .fill {
  height: 100%;
  border-radius: 3px;
  transition: width 0.5s ease;
}

.girl-card[open] {
  flex: 1 1 100%;
}

/* --- 锁定态（保持原配色，仅调文字）--- */
.girl-card.locked[data-type="nona"] {
  background: linear-gradient(135deg, rgba(135, 180, 255, 0.05), rgba(180, 210, 255, 0.08));
  border-color: rgba(100, 150, 230, 0.25);
  border-style: dashed;
  opacity: 0.7;
}
.girl-card.locked[data-type="kuma"] {
  background: linear-gradient(135deg, rgba(200, 130, 170, 0.05), rgba(220, 160, 190, 0.08));
  border-color: rgba(200, 120, 160, 0.25);
  border-style: dashed;
  opacity: 0.7;
}
.girl-card.locked[data-type="mota"] {
  background: linear-gradient(135deg, rgba(180, 160, 220, 0.05), rgba(200, 180, 240, 0.08));
  border-color: rgba(160, 130, 210, 0.25);
  border-style: dashed;
  opacity: 0.7;
}
.girl-card.locked .girl-name { color: #776880; }

/* --- 天真形 诺娜 --- */
.girl-card[data-type="nona"] {
  background: linear-gradient(135deg, rgba(135, 180, 255, 0.1), rgba(180, 210, 255, 0.15));
  border-color: rgba(100, 150, 230, 0.35);
}
.girl-card[data-type="nona"] .girl-name { color: #4a6fa5; }
.girl-card[data-type="nona"] .girl-sub { color: #7ba7d9; }
.girl-card[data-type="nona"] .mini-bar .fill { background: linear-gradient(90deg, #7ba7d9, #4a8fe7); }
.girl-card[data-type="nona"] .d-section { color: #8dbde8; border-color: rgba(100, 150, 230, 0.3); }
.girl-card[data-type="nona"] .d-row { color: #c0d4ec; }
.girl-card[data-type="nona"] .b-lbl { color: #a0c0e0; }
.girl-card[data-type="nona"] .b-desc { color: #90b0d0; }
.girl-card[data-type="nona"] .b-dev { color: #8dbde8; }
.girl-card[data-type="nona"] .f-lbl { color: #a0c0e0; }
.girl-card[data-type="nona"] .f-num { color: #c0d4ec; }

/* --- 温顺形 库玛 --- */
.girl-card[data-type="kuma"] {
  background: linear-gradient(135deg, rgba(200, 130, 170, 0.1), rgba(220, 160, 190, 0.15));
  border-color: rgba(200, 120, 160, 0.35);
}
.girl-card[data-type="kuma"] .girl-name { color: #a5567a; }
.girl-card[data-type="kuma"] .girl-sub { color: #d98aab; }
.girl-card[data-type="kuma"] .mini-bar .fill { background: linear-gradient(90deg, #d98aab, #c75b8a); }
.girl-card[data-type="kuma"] .d-section { color: #e8a0c0; border-color: rgba(200, 120, 160, 0.3); }
.girl-card[data-type="kuma"] .d-row { color: #e0c0d0; }
.girl-card[data-type="kuma"] .b-lbl { color: #d0a8bc; }
.girl-card[data-type="kuma"] .b-desc { color: #c098b0; }
.girl-card[data-type="kuma"] .b-dev { color: #e8a0c0; }
.girl-card[data-type="kuma"] .f-lbl { color: #d0a8bc; }
.girl-card[data-type="kuma"] .f-num { color: #e0c0d0; }

/* --- 慈爱形 莫塔 --- */
.girl-card[data-type="mota"] {
  background: linear-gradient(135deg, rgba(180, 160, 220, 0.1), rgba(200, 180, 240, 0.15));
  border-color: rgba(160, 130, 210, 0.35);
}
.girl-card[data-type="mota"] .girl-name { color: #7a5a9e; }
.girl-card[data-type="mota"] .girl-sub { color: #b08ad9; }
.girl-card[data-type="mota"] .mini-bar .fill { background: linear-gradient(90deg, #b08ad9, #8a5bc7); }
.girl-card[data-type="mota"] .d-section { color: #c4a0e8; border-color: rgba(160, 130, 210, 0.3); }
.girl-card[data-type="mota"] .d-row { color: #d0c0e0; }
.girl-card[data-type="mota"] .b-lbl { color: #b8a8d0; }
.girl-card[data-type="mota"] .b-desc { color: #a898c0; }
.girl-card[data-type="mota"] .b-dev { color: #c4a0e8; }
.girl-card[data-type="mota"] .f-lbl { color: #b8a8d0; }
.girl-card[data-type="mota"] .f-num { color: #d0c0e0; }

/* --- 眼球展开详情 --- */
.girl-detail {
  padding: 10px 12px;
  font-size: 0.85em;
  border-top: 1px dashed rgba(180, 100, 140, 0.2);
}

.d-row {
  color: #c8b8d4;
  margin-bottom: 6px;
  line-height: 1.5;
}

.d-section {
  font-weight: bold;
  font-size: 0.9em;
  margin: 10px 0 6px 0;
  padding-top: 8px;
  border-top: 1px dashed rgba(180, 100, 140, 0.2);
}

.girl-detail .body-row {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 4px;
  font-size: 0.92em;
}

.girl-detail .b-lbl {
  min-width: 60px;
  color: #b0a0b8;
  white-space: nowrap;
}

.girl-detail .b-desc {
  flex: 1;
  color: #a898b0;
  font-size: 0.9em;
}

.girl-detail .b-dev {
  min-width: 36px;
  text-align: right;
  font-size: 0.85em;
  color: #e8a0c0;
  font-weight: 500;
}

/* --- 眼球内进度条 --- */
.full-bar {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 5px;
  font-size: 0.88em;
}

.f-lbl {
  min-width: 55px;
  white-space: nowrap;
  color: #b0a0b8;
}

.f-track {
  flex: 1;
  height: 7px;
  background: rgba(255, 255, 255, 0.06);
  border-radius: 4px;
  overflow: hidden;
}

.f-track .fill {
  height: 100%;
  border-radius: 4px;
  transition: width 0.5s ease;
}

.love-color { background: linear-gradient(90deg, #d98aab, #c74b7a); }
.trust-color { background: linear-gradient(90deg, #6db5a0, #3a9e82); }

.f-num {
  min-width: 60px;
  text-align: right;
  color: #c8b8d4;
  font-size: 0.9em;
}

/* ===== 通用面板 ===== */
.panel {
  background: rgba(180, 100, 140, 0.05);
  border: 1px solid rgba(180, 100, 140, 0.2);
  border-radius: 12px;
  padding: 10px 12px;
  margin-bottom: 10px;
}

.panel > summary {
  list-style: none;
  cursor: pointer;
  font-weight: bold;
  color: #d9b3c7;
  font-size: 0.95em;
  padding: 4px 0;
  display: flex;
  align-items: center;
  gap: 6px;
}

.panel > summary::-webkit-details-marker { display: none; }

.panel > summary::before {
  content: '▶';
  font-size: 0.7em;
  transition: transform 0.3s;
  color: #e8a0c0;
}

.panel[open] > summary::before {
  transform: rotate(90deg);
}

.tag {
  font-size: 0.78em;
  font-weight: normal;
  color: #fff;
  background: #c74b7a;
  padding: 1px 6px;
  border-radius: 4px;
  margin-left: 4px;
}

/* ===== User面板 ===== */
.card-body {
  padding-top: 8px;
}

.grid-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
  font-size: 0.88em;
  color: #c8b8d4;
  margin-bottom: 5px;
  line-height: 1.6;
}

/* ===== NPC面板 ===== */
.npc-card {
  padding: 8px 0;
  border-bottom: 1px dashed rgba(180, 100, 140, 0.15);
}

.npc-card:last-child { border-bottom: none; }

.npc-header {
  font-weight: bold;
  color: #d9b3c7;
  font-size: 0.92em;
  margin-bottom: 4px;
}

/* ===== 背包 ===== */
.item-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 5px;
  margin-top: 8px;
}

.item-cell {
  aspect-ratio: 1;
  border: 1px solid rgba(180, 100, 140, 0.25);
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  font-size: 0.75em;
  padding: 3px;
  background: rgba(255, 255, 255, 0.04);
  transition: all 0.2s;
  position: relative;
  cursor: default;
}

.item-cell:hover {
  background: rgba(180, 100, 140, 0.1);
  border-color: #c74b7a;
  transform: scale(1.05);
  z-index: 10;
  box-shadow: 0 3px 10px rgba(200, 80, 130, 0.2);
}

.item-cell.empty {
  background: rgba(255, 255, 255, 0.02);
  border-style: dashed;
  color: #665870;
  font-size: 0.8em;
}

.item-cell.empty:hover {
  transform: none;
  box-shadow: none;
  border-color: rgba(180, 100, 140, 0.25);
}

.item-icon { font-size: 1.4em; }

.item-name {
  font-size: 0.85em;
  color: #c8b8d4;
  text-align: center;
  line-height: 1.2;
  margin-top: 2px;
}

.item-count {
  font-size: 0.8em;
  color: #e8a0c0;
  font-weight: bold;
}

.item-tooltip {
  display: none;
  position: absolute;
  bottom: calc(100% + 8px);
  left: 50%;
  transform: translateX(-50%);
  width: 160px;
  background: rgba(24, 16, 30, 0.97);
  border: 2px solid #c74b7a;
  border-radius: 10px;
  padding: 8px 10px;
  z-index: 200;
  box-shadow: 0 6px 20px rgba(200, 80, 130, 0.25);
  backdrop-filter: blur(8px);
  text-align: left;
}

.item-tooltip::after {
  content: '';
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  border: 6px solid transparent;
  border-top-color: #c74b7a;
}

.item-cell:hover .item-tooltip,
.item-cell:active .item-tooltip {
  display: block;
  animation: popIn 0.25s ease-out;
}

.tt-title {
  font-weight: bold;
  color: #d9b3c7;
  margin: 0 0 4px 0;
  padding-bottom: 4px;
  border-bottom: 1px solid rgba(180, 100, 140, 0.2);
  font-size: 0.92em;
}

.tt-type {
  display: inline-block;
  font-size: 0.78em;
  color: #fff;
  background: #a5567a;
  padding: 1px 6px;
  border-radius: 4px;
  margin-bottom: 4px;
}

.tt-desc {
  font-size: 0.85em;
  color: #b0a0b8;
  line-height: 1.4;
}

/* ===== 选项栏 ===== */
.action-box {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  padding: 10px 12px;
  border: 1px solid rgba(100, 120, 160, 0.25);
  background: rgba(100, 120, 160, 0.06);
  border-radius: 12px;
}

.opt {
  text-align: center;
  padding: 10px 8px;
  border: 1px solid rgba(100, 120, 160, 0.3);
  border-radius: 8px;
  font-size: 0.9em;
  color: #a8c0e0;
  background: rgba(255, 255, 255, 0.04);
  cursor: pointer;
  transition: all 0.25s;
  line-height: 1.3;
}

.opt:hover {
  background: rgba(90, 122, 158, 0.25);
  color: #e0ecff;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(90, 122, 158, 0.2);
}

/* --- 对话标签保持原代表色 --- */
nona {
  color: #FF1493;
}

kuma {
  color: #FFB6C1;
}

mota {
  color: #FF0066;
}

alert {
  color: #FF0000;
  font-weight: bold;
}

/* ===== 动画 ===== */
@keyframes popIn {
  from { opacity: 0; transform: translateX(-50%) translateY(8px); }
  to { opacity: 1; transform: translateX(-50%) translateY(0); }
}

@keyframes hungerPulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.5; }
}

/* ===== 移动端 ===== */
@media (max-width: 480px) {
  .girls-row { gap: 5px; }
  .girl-name { font-size: 0.78em; }
  .girl-detail { font-size: 0.82em; padding: 8px; }
  .girl-detail .body-row { font-size: 0.88em; }
  .girl-detail .b-lbl { min-width: 50px; }
  .grid-row { font-size: 0.83em; gap: 4px 8px; }
  .item-grid { grid-template-columns: repeat(4, 1fr); }
  .item-tooltip { width: 140px; font-size: 0.9em; }
  .action-box { grid-template-columns: 1fr; }
  .hud-line { font-size: 0.8em; }
  .full-bar { font-size: 0.82em; }
  .f-lbl { min-width: 45px; }
  .hud-num { min-width: 55px; font-size: 0.85em; }
}
/* ============================================
   深色聊天框完整美化 · 星尘与眼瞳
   ============================================ */

/* === 1. 聊天框主体：深色玻璃质感 + 呼吸光边 === */
.bg-gray-100\/90.relative.inline-block {
    background: linear-gradient(
        145deg,
        rgba(18, 12, 22, 0.92),
        rgba(30, 18, 35, 0.88),
        rgba(22, 14, 28, 0.92)
    ) !important;
    border: 1px solid rgba(180, 100, 140, 0.25) !important;
    border-radius: 18px !important;
    backdrop-filter: blur(16px) saturate(1.2) !important;
    box-shadow:
        0 0 0 1px rgba(180, 100, 140, 0.08),
        0 4px 24px rgba(0, 0, 0, 0.6),
        0 12px 48px rgba(100, 50, 80, 0.15),
        inset 0 1px 0 rgba(255, 255, 255, 0.04) !important;
    padding: 16px 14px !important;
    position: relative !important;
    isolation: isolate !important;
    overflow: hidden !important;
    transition: box-shadow 0.4s ease, border-color 0.4s ease !important;
}

/* 鼠标悬停时边框微亮 */
.bg-gray-100\/90.relative.inline-block:hover {
    border-color: rgba(200, 120, 160, 0.45) !important;
    box-shadow:
        0 0 0 1px rgba(200, 120, 160, 0.15),
        0 4px 24px rgba(0, 0, 0, 0.6),
        0 12px 48px rgba(140, 70, 110, 0.25),
        0 0 60px rgba(180, 100, 140, 0.08),
        inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
}

/* === 2. 背景星尘粒子（::before）+ 流光扫描线（::after）=== */
.bg-gray-100\/90.relative.inline-block::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: 0 !important;
    pointer-events: none !important;
    border-radius: 18px !important;
    opacity: 0.5 !important;
    /* 星尘粒子 - 使用SMIL动画的内联SVG */
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Ccircle cx='45' cy='60' r='1' fill='%237ba7d9' opacity='0'%3E%3Canimate attributeName='opacity' values='0;0.8;0' dur='3.2s' repeatCount='indefinite' begin='0s'/%3E%3C/circle%3E%3Ccircle cx='120' cy='30' r='0.8' fill='%23d98aab' opacity='0'%3E%3Canimate attributeName='opacity' values='0;0.7;0' dur='2.8s' repeatCount='indefinite' begin='0.5s'/%3E%3C/circle%3E%3Ccircle cx='200' cy='80' r='1.2' fill='%23b08ad9' opacity='0'%3E%3Canimate attributeName='opacity' values='0;0.9;0' dur='4s' repeatCount='indefinite' begin='1s'/%3E%3C/circle%3E%3Ccircle cx='80' cy='150' r='0.6' fill='%23d98aab' opacity='0'%3E%3Canimate attributeName='opacity' values='0;0.6;0' dur='3.5s' repeatCount='indefinite' begin='1.5s'/%3E%3C/circle%3E%3Ccircle cx='250' cy='120' r='1' fill='%237ba7d9' opacity='0'%3E%3Canimate attributeName='opacity' values='0;0.8;0' dur='3s' repeatCount='indefinite' begin='0.8s'/%3E%3C/circle%3E%3Ccircle cx='160' cy='200' r='0.7' fill='%23b08ad9' opacity='0'%3E%3Canimate attributeName='opacity' values='0;0.7;0' dur='3.8s' repeatCount='indefinite' begin='2s'/%3E%3C/circle%3E%3Ccircle cx='30' cy='250' r='0.9' fill='%237ba7d9' opacity='0'%3E%3Canimate attributeName='opacity' values='0;0.5;0' dur='4.2s' repeatCount='indefinite' begin='0.3s'/%3E%3C/circle%3E%3Ccircle cx='270' cy='220' r='1.1' fill='%23d98aab' opacity='0'%3E%3Canimate attributeName='opacity' values='0;0.6;0' dur='3.6s' repeatCount='indefinite' begin='1.2s'/%3E%3C/circle%3E%3Ccircle cx='140' cy='270' r='0.8' fill='%23b08ad9' opacity='0'%3E%3Canimate attributeName='opacity' values='0;0.8;0' dur='2.9s' repeatCount='indefinite' begin='0.7s'/%3E%3C/circle%3E%3Ccircle cx='220' cy='170' r='0.5' fill='%237ba7d9' opacity='0'%3E%3Canimate attributeName='opacity' values='0;0.9;0' dur='3.3s' repeatCount='indefinite' begin='1.8s'/%3E%3C/circle%3E%3Ccircle cx='95' cy='95' r='1.3' fill='%23d98aab' opacity='0'%3E%3Canimate attributeName='opacity' values='0;0.4;0' dur='5s' repeatCount='indefinite' begin='0.2s'/%3E%3C/circle%3E%3Ccircle cx='185' cy='45' r='0.6' fill='%23b08ad9' opacity='0'%3E%3Canimate attributeName='opacity' values='0;0.7;0' dur='4.5s' repeatCount='indefinite' begin='2.5s'/%3E%3C/circle%3E%3C/svg%3E") !important;
    background-size: 300px 300px !important;
    background-repeat: repeat !important;
}

/* 流光扫描线 */
.bg-gray-100\/90.relative.inline-block::after {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: 0 !important;
    pointer-events: none !important;
    border-radius: 18px !important;
    opacity: 0.06 !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='400' height='400'%3E%3Cdefs%3E%3ClinearGradient id='scan' x1='0' y1='0' x2='0' y2='1'%3E%3Cstop offset='0%25' stop-color='%23c74b7a' stop-opacity='0'/%3E%3Cstop offset='50%25' stop-color='%23c74b7a' stop-opacity='1'/%3E%3Cstop offset='100%25' stop-color='%23c74b7a' stop-opacity='0'/%3E%3C/linearGradient%3E%3C/defs%3E%3Crect x='0' y='0' width='400' height='6' fill='url(%23scan)' opacity='0.8'%3E%3CanimateTransform attributeName='transform' type='translate' values='0 -10;0 410' dur='6s' repeatCount='indefinite'/%3E%3C/rect%3E%3C/svg%3E") !important;
    background-size: 100% 400px !important;
    background-repeat: no-repeat !important;
}

/* === 3. 移除顶部颜色装饰条 === */
[class*="bg-[#F1CBCB]"],
[class*="bg-[#c9e9e9]"] {
    display: none !important;
}

/* === 4. 正文文本层：确保在粒子之上 === */
.markdown-body {
    color: #E8E0EC !important;
    font-family: "Microsoft YaHei", -apple-system, "Segoe UI", sans-serif !important;
    line-height: 1.8 !important;
    position: relative !important;
    z-index: 1 !important;
    background: transparent !important;
    letter-spacing: 0.02em !important;
}

/* 正文内链接 */
.markdown-body a {
    color: #d98aab !important;
    text-decoration: underline !important;
    text-decoration-color: rgba(217, 138, 171, 0.3) !important;
    text-underline-offset: 3px !important;
    transition: color 0.2s, text-decoration-color 0.2s !important;
}

.markdown-body a:hover {
    color: #e8a8c4 !important;
    text-decoration-color: rgba(232, 168, 196, 0.6) !important;
}

/* 正文内代码块 */
.markdown-body code {
    background: rgba(180, 100, 140, 0.12) !important;
    color: #d9b3c7 !important;
    border: 1px solid rgba(180, 100, 140, 0.2) !important;
    border-radius: 5px !important;
    padding: 1px 5px !important;
    font-size: 0.9em !important;
}

.markdown-body pre {
    background: rgba(10, 6, 14, 0.7) !important;
    border: 1px solid rgba(180, 100, 140, 0.2) !important;
    border-radius: 10px !important;
    padding: 12px !important;
    position: relative !important;
    z-index: 1 !important;
}

.markdown-body pre code {
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    color: #c8b8d4 !important;
}

/* 正文内引用块 */
.markdown-body blockquote {
    border-left: 3px solid rgba(180, 100, 140, 0.5) !important;
    background: rgba(180, 100, 140, 0.06) !important;
    padding: 8px 14px !important;
    border-radius: 0 8px 8px 0 !important;
    margin: 8px 0 !important;
    color: #c8b8cc !important;
}

/* 正文内分割线 */
.markdown-body hr {
    border: none !important;
    height: 1px !important;
    background: linear-gradient(
        90deg,
        transparent,
        rgba(180, 100, 140, 0.4),
        rgba(123, 167, 217, 0.3),
        rgba(176, 138, 217, 0.4),
        transparent
    ) !important;
    margin: 16px 0 !important;
}

/* 正文内标题 */
.markdown-body h1,
.markdown-body h2,
.markdown-body h3,
.markdown-body h4 {
    color: #e0d0e8 !important;
    border-bottom-color: rgba(180, 100, 140, 0.2) !important;
}

/* 正文内表格 */
.markdown-body table {
    border-collapse: collapse !important;
}

.markdown-body th {
    background: rgba(180, 100, 140, 0.15) !important;
    color: #e0d0e8 !important;
    border: 1px solid rgba(180, 100, 140, 0.25) !important;
    padding: 6px 10px !important;
}

.markdown-body td {
    border: 1px solid rgba(180, 100, 140, 0.15) !important;
    padding: 6px 10px !important;
    color: #d0c0d8 !important;
}

.markdown-body tr:nth-child(even) td {
    background: rgba(180, 100, 140, 0.04) !important;
}

/* 正文内列表标记 */
.markdown-body ul {
    list-style-type: disc !important;
}

.markdown-body li::marker {
    color: #c74b7a !important;
}

/* 加粗与斜体 */
.markdown-body strong {
    color: #f0e0f4 !important;
    font-weight: bold !important;
}

.markdown-body em {
    color: #d9b3c7 !important;
}

/* === 5. 底部附加元素 === */
.MuiButtonBase-root.MuiButton-root.MuiButton-text.MuiButton-textPrimary {
    color: rgba(200, 180, 210, 0.7) !important;
    font-size: 0.82em !important;
    transition: color 0.25s, text-shadow 0.25s !important;
    position: relative !important;
    z-index: 1 !important;
}

.MuiButtonBase-root.MuiButton-root.MuiButton-text.MuiButton-textPrimary:hover {
    color: #d98aab !important;
    text-shadow: 0 0 12px rgba(217, 138, 171, 0.4) !important;
}

.MuiTypography-root.MuiTypography-body2.css-6c0gf2 {
    color: rgba(176, 138, 217, 0.6) !important;
    font-size: 0.78em !important;
    letter-spacing: 0.5px !important;
    position: relative !important;
    z-index: 1 !important;
}

.text-orange-500 {
    color: rgba(217, 160, 84, 0.75) !important;
    font-size: 0.8em !important;
    position: relative !important;
    z-index: 1 !important;
}

/* === 6. 加载动画：「眼睛们一直在等着你...」=== */

/* 隐藏原生加载 */
.style_dot-flashing__8L91Q.style_text__zGhNq {
    display: none !important;
}

/* 加载容器重构 */
.flex.items-center.justify-center.w-6.h-5 {
    width: 280px !important;
    height: 50px !important;
    min-height: 50px !important;
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/*
  逐字浮现 + 独立光晕脉冲
  颜色映射：
    眼(#7ba7d9·诺娜) 睛(#7ba7d9·诺娜)
    们(#d98aab·库玛) 一(#d98aab·库玛)
    直(#b08ad9·莫塔) 在(#b08ad9·莫塔)
    等(#7ba7d9·诺娜) 着(#d98aab·库玛) 你(#b08ad9·莫塔)
    ...(#c74b7a·主题色)
    
  CSP备注：若 data: URI 被 CSP 禁止，可替换为同源外链：
  /assets/svg/loading-eyes.svg
*/
.flex.items-center.justify-center.w-6.h-5::before {
    content: "" !important;
    display: block !important;
    width: 260px !important;
    height: 40px !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: contain !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 260 40' width='260' height='40'%3E%3Cdefs%3E%3Cfilter id='g1' x='-50%25' y='-50%25' width='200%25' height='200%25'%3E%3CfeGaussianBlur stdDeviation='2' result='b'/%3E%3CfeMerge%3E%3CfeMergeNode in='b'/%3E%3CfeMergeNode in='SourceGraphic'/%3E%3C/feMerge%3E%3C/filter%3E%3Cfilter id='g2' x='-50%25' y='-50%25' width='200%25' height='200%25'%3E%3CfeGaussianBlur stdDeviation='2' result='b'/%3E%3CfeMerge%3E%3CfeMergeNode in='b'/%3E%3CfeMergeNode in='SourceGraphic'/%3E%3C/feMerge%3E%3C/filter%3E%3Cfilter id='g3' x='-50%25' y='-50%25' width='200%25' height='200%25'%3E%3CfeGaussianBlur stdDeviation='2' result='b'/%3E%3CfeMerge%3E%3CfeMergeNode in='b'/%3E%3CfeMergeNode in='SourceGraphic'/%3E%3C/feMerge%3E%3C/filter%3E%3C/defs%3E%3C!-- 眼 --%3E%3Ctext x='10' y='28' font-family='sans-serif' font-weight='bold' font-size='16' fill='%237ba7d9' opacity='0' filter='url(%23g1)'%3E%3Canimate attributeName='opacity' values='0;0;1;1;1;0.3;0' dur='4s' repeatCount='indefinite' begin='0s'/%3E%3CanimateTransform attributeName='transform' type='translate' values='0 6;0 6;0 0;0 0;0 0;0 2;0 6' dur='4s' repeatCount='indefinite' begin='0s'/%3E眼%3C/text%3E%3C!-- 睛 --%3E%3Ctext x='30' y='28' font-family='sans-serif' font-weight='bold' font-size='16' fill='%237ba7d9' opacity='0' filter='url(%23g1)'%3E%3Canimate attributeName='opacity' values='0;0;0;1;1;1;0.3;0' dur='4s' repeatCount='indefinite' begin='0.2s'/%3E%3CanimateTransform attributeName='transform' type='translate' values='0 6;0 6;0 6;0 0;0 0;0 0;0 2;0 6' dur='4s' repeatCount='indefinite' begin='0.2s'/%3E睛%3C/text%3E%3C!-- 们 --%3E%3Ctext x='50' y='28' font-family='sans-serif' font-weight='bold' font-size='16' fill='%23d98aab' opacity='0' filter='url(%23g2)'%3E%3Canimate attributeName='opacity' values='0;0;1;1;1;0.3;0' dur='4s' repeatCount='indefinite' begin='0.4s'/%3E%3CanimateTransform attributeName='transform' type='translate' values='0 6;0 6;0 0;0 0;0 0;0 2;0 6' dur='4s' repeatCount='indefinite' begin='0.4s'/%3E们%3C/text%3E%3C!-- 一 --%3E%3Ctext x='70' y='28' font-family='sans-serif' font-weight='bold' font-size='16' fill='%23d98aab' opacity='0' filter='url(%23g2)'%3E%3Canimate attributeName='opacity' values='0;0;1;1;1;0.3;0' dur='4s' repeatCount='indefinite' begin='0.6s'/%3E%3CanimateTransform attributeName='transform' type='translate' values='0 6;0 6;0 0;0 0;0 0;0 2;0 6' dur='4s' repeatCount='indefinite' begin='0.6s'/%3E一%3C/text%3E%3C!-- 直 --%3E%3Ctext x='90' y='28' font-family='sans-serif' font-weight='bold' font-size='16' fill='%23b08ad9' opacity='0' filter='url(%23g3)'%3E%3Canimate attributeName='opacity' values='0;0;1;1;1;0.3;0' dur='4s' repeatCount='indefinite' begin='0.8s'/%3E%3CanimateTransform attributeName='transform' type='translate' values='0 6;0 6;0 0;0 0;0 0;0 2;0 6' dur='4s' repeatCount='indefinite' begin='0.8s'/%3E直%3C/text%3E%3C!-- 在 --%3E%3Ctext x='110' y='28' font-family='sans-serif' font-weight='bold' font-size='16' fill='%23b08ad9' opacity='0' filter='url(%23g3)'%3E%3Canimate attributeName='opacity' values='0;0;1;1;1;0.3;0' dur='4s' repeatCount='indefinite' begin='1.0s'/%3E%3CanimateTransform attributeName='transform' type='translate' values='0 6;0 6;0 0;0 0;0 0;0 2;0 6' dur='4s' repeatCount='indefinite' begin='1.0s'/%3E在%3C/text%3E%3C!-- 等 --%3E%3Ctext x='130' y='28' font-family='sans-serif' font-weight='bold' font-size='16' fill='%237ba7d9' opacity='0' filter='url(%23g1)'%3E%3Canimate attributeName='opacity' values='0;0;1;1;1;0.3;0' dur='4s' repeatCount='indefinite' begin='1.2s'/%3E%3CanimateTransform attributeName='transform' type='translate' values='0 6;0 6;0 0;0 0;0 0;0 2;0 6' dur='4s' repeatCount='indefinite' begin='1.2s'/%3E等%3C/text%3E%3C!-- 着 --%3E%3Ctext x='150' y='28' font-family='sans-serif' font-weight='bold' font-size='16' fill='%23d98aab' opacity='0' filter='url(%23g2)'%3E%3Canimate attributeName='opacity' values='0;0;1;1;1;0.3;0' dur='4s' repeatCount='indefinite' begin='1.4s'/%3E%3CanimateTransform attributeName='transform' type='translate' values='0 6;0 6;0 0;0 0;0 0;0 2;0 6' dur='4s' repeatCount='indefinite' begin='1.4s'/%3E着%3C/text%3E%3C!-- 你 --%3E%3Ctext x='170' y='28' font-family='sans-serif' font-weight='bold' font-size='16' fill='%23b08ad9' opacity='0' filter='url(%23g3)'%3E%3Canimate attributeName='opacity' values='0;0;1;1;1;0.3;0' dur='4s' repeatCount='indefinite' begin='1.6s'/%3E%3CanimateTransform attributeName='transform' type='translate' values='0 6;0 6;0 0;0 0;0 0;0 2;0 6' dur='4s' repeatCount='indefinite' begin='1.6s'/%3E你%3C/text%3E%3C!-- 点1 --%3E%3Ccircle cx='196' cy='25' r='2.5' fill='%23c74b7a' opacity='0'%3E%3Canimate attributeName='opacity' values='0;0;1;1;0.4;0' dur='4s' repeatCount='indefinite' begin='2.0s'/%3E%3Canimate attributeName='r' values='1;1;2.5;3;2;1' dur='4s' repeatCount='indefinite' begin='2.0s'/%3E%3C/circle%3E%3C!-- 点2 --%3E%3Ccircle cx='206' cy='25' r='2.5' fill='%23c74b7a' opacity='0'%3E%3Canimate attributeName='opacity' values='0;0;1;1;0.4;0' dur='4s' repeatCount='indefinite' begin='2.3s'/%3E%3Canimate attributeName='r' values='1;1;2.5;3;2;1' dur='4s' repeatCount='indefinite' begin='2.3s'/%3E%3C/circle%3E%3C!-- 点3 --%3E%3Ccircle cx='216' cy='25' r='2.5' fill='%23c74b7a' opacity='0'%3E%3Canimate attributeName='opacity' values='0;0;1;1;0.4;0' dur='4s' repeatCount='indefinite' begin='2.6s'/%3E%3Canimate attributeName='r' values='1;1;2.5;3;2;1' dur='4s' repeatCount='indefinite' begin='2.6s'/%3E%3C/circle%3E%3C/svg%3E") !important;
}

/* 加载容器底部微光条 */
.flex.items-center.justify-center.w-6.h-5::after {
    content: "" !important;
    position: absolute !important;
    bottom: 2px !important;
    left: 10% !important;
    width: 80% !important;
    height: 1px !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='2'%3E%3Cdefs%3E%3ClinearGradient id='lg' x1='0' y1='0' x2='1' y2='0'%3E%3Cstop offset='0%25' stop-color='%237ba7d9' stop-opacity='0'/%3E%3Cstop offset='25%25' stop-color='%237ba7d9' stop-opacity='0.6'/%3E%3Cstop offset='50%25' stop-color='%23d98aab' stop-opacity='0.8'/%3E%3Cstop offset='75%25' stop-color='%23b08ad9' stop-opacity='0.6'/%3E%3Cstop offset='100%25' stop-color='%23b08ad9' stop-opacity='0'/%3E%3C/linearGradient%3E%3C/defs%3E%3Crect width='200' height='2' fill='url(%23lg)' opacity='0.5'%3E%3Canimate attributeName='opacity' values='0.2;0.6;0.2' dur='3s' repeatCount='indefinite'/%3E%3C/rect%3E%3C/svg%3E") !important;
    background-size: 100% 100% !important;
    background-repeat: no-repeat !important;
    pointer-events: none !important;
}

/* === 7. 输入框单独微调（可选：略浅一点区分输入/输出）=== */
.bg-gray-100\/90.relative.inline-block:not(.chat-answer-container .bg-gray-100\/90) {
    background: linear-gradient(
        145deg,
        rgba(22, 16, 28, 0.88),
        rgba(35, 22, 42, 0.84)
    ) !important;
    border-color: rgba(123, 167, 217, 0.2) !important;
}

.bg-gray-100\/90.relative.inline-block:not(.chat-answer-container .bg-gray-100\/90):hover {
    border-color: rgba(123, 167, 217, 0.4) !important;
}

/* === 8. 移动端适配 === */
@media (max-width: 480px) {
    .bg-gray-100\/90.relative.inline-block {
        border-radius: 14px !important;
        padding: 12px 10px !important;
        margin-left: 2px !important;
        margin-right: 2px !important;
    }

    .flex.items-center.justify-center.w-6.h-5 {
        width: 240px !important;
        height: 44px !important;
        min-height: 44px !important;
    }

    .flex.items-center.justify-center.w-6.h-5::before {
        width: 220px !important;
        height: 36px !important;
    }
}

/* === 9. 低动效偏好 === */
@media (prefers-reduced-motion: reduce) {
    .bg-gray-100\/90.relative.inline-block::before {
        /* 星尘粒子降低频率：将闪烁周期拉长至8秒 */
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Ccircle cx='45' cy='60' r='1' fill='%237ba7d9' opacity='0'%3E%3Canimate attributeName='opacity' values='0;0.5;0' dur='8s' repeatCount='indefinite' begin='0s'/%3E%3C/circle%3E%3Ccircle cx='120' cy='30' r='0.8' fill='%23d98aab' opacity='0'%3E%3Canimate attributeName='opacity' values='0;0.4;0' dur='8s' repeatCount='indefinite' begin='1s'/%3E%3C/circle%3E%3Ccircle cx='200' cy='80' r='1.2' fill='%23b08ad9' opacity='0'%3E%3Canimate attributeName='opacity' values='0;0.5;0' dur='8s' repeatCount='indefinite' begin='2s'/%3E%3C/circle%3E%3Ccircle cx='80' cy='150' r='0.6' fill='%23d98aab' opacity='0'%3E%3Canimate attributeName='opacity' values='0;0.3;0' dur='8s' repeatCount='indefinite' begin='3s'/%3E%3C/circle%3E%3Ccircle cx='250' cy='120' r='1' fill='%237ba7d9' opacity='0'%3E%3Canimate attributeName='opacity' values='0;0.4;0' dur='8s' repeatCount='indefinite' begin='1.5s'/%3E%3C/circle%3E%3Ccircle cx='160' cy='200' r='0.7' fill='%23b08ad9' opacity='0'%3E%3Canimate attributeName='opacity' values='0;0.4;0' dur='8s' repeatCount='indefinite' begin='4s'/%3E%3C/circle%3E%3C/svg%3E") !important;
        opacity: 0.3 !important;
    }

    /* 扫描线：降低为极缓慢呼吸，周期拉长至15秒 */
    .bg-gray-100\/90.relative.inline-block::after {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='400' height='400'%3E%3Cdefs%3E%3ClinearGradient id='scan' x1='0' y1='0' x2='0' y2='1'%3E%3Cstop offset='0%25' stop-color='%23c74b7a' stop-opacity='0'/%3E%3Cstop offset='50%25' stop-color='%23c74b7a' stop-opacity='1'/%3E%3Cstop offset='100%25' stop-color='%23c74b7a' stop-opacity='0'/%3E%3C/linearGradient%3E%3C/defs%3E%3Crect x='0' y='0' width='400' height='6' fill='url(%23scan)' opacity='0.5'%3E%3CanimateTransform attributeName='transform' type='translate' values='0 -10;0 410' dur='15s' repeatCount='indefinite'/%3E%3C/rect%3E%3C/svg%3E") !important;
        opacity: 0.03 !important;
    }

    /* 加载文字：去掉位移动画，仅保留缓慢的透明度呼吸 */
    .flex.items-center.justify-center.w-6.h-5::before {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 260 40' width='260' height='40'%3E%3Ctext x='10' y='28' font-family='sans-serif' font-weight='bold' font-size='16' fill='%237ba7d9' opacity='0.3'%3E%3Canimate attributeName='opacity' values='0.3;0.8;0.3' dur='6s' repeatCount='indefinite' begin='0s'/%3E眼%3C/text%3E%3Ctext x='30' y='28' font-family='sans-serif' font-weight='bold' font-size='16' fill='%237ba7d9' opacity='0.3'%3E%3Canimate attributeName='opacity' values='0.3;0.8;0.3' dur='6s' repeatCount='indefinite' begin='0.3s'/%3E睛%3C/text%3E%3Ctext x='50' y='28' font-family='sans-serif' font-weight='bold' font-size='16' fill='%23d98aab' opacity='0.3'%3E%3Canimate attributeName='opacity' values='0.3;0.8;0.3' dur='6s' repeatCount='indefinite' begin='0.6s'/%3E们%3C/text%3E%3Ctext x='70' y='28' font-family='sans-serif' font-weight='bold' font-size='16' fill='%23d98aab' opacity='0.3'%3E%3Canimate attributeName='opacity' values='0.3;0.8;0.3' dur='6s' repeatCount='indefinite' begin='0.9s'/%3E一%3C/text%3E%3Ctext x='90' y='28' font-family='sans-serif' font-weight='bold' font-size='16' fill='%23b08ad9' opacity='0.3'%3E%3Canimate attributeName='opacity' values='0.3;0.8;0.3' dur='6s' repeatCount='indefinite' begin='1.2s'/%3E直%3C/text%3E%3Ctext x='110' y='28' font-family='sans-serif' font-weight='bold' font-size='16' fill='%23b08ad9' opacity='0.3'%3E%3Canimate attributeName='opacity' values='0.3;0.8;0.3' dur='6s' repeatCount='indefinite' begin='1.5s'/%3E在%3C/text%3E%3Ctext x='130' y='28' font-family='sans-serif' font-weight='bold' font-size='16' fill='%237ba7d9' opacity='0.3'%3E%3Canimate attributeName='opacity' values='0.3;0.8;0.3' dur='6s' repeatCount='indefinite' begin='1.8s'/%3E等%3C/text%3E%3Ctext x='150' y='28' font-family='sans-serif' font-weight='bold' font-size='16' fill='%23d98aab' opacity='0.3'%3E%3Canimate attributeName='opacity' values='0.3;0.8;0.3' dur='6s' repeatCount='indefinite' begin='2.1s'/%3E着%3C/text%3E%3Ctext x='170' y='28' font-family='sans-serif' font-weight='bold' font-size='16' fill='%23b08ad9' opacity='0.3'%3E%3Canimate attributeName='opacity' values='0.3;0.8;0.3' dur='6s' repeatCount='indefinite' begin='2.4s'/%3E你%3C/text%3E%3Ccircle cx='196' cy='25' r='2' fill='%23c74b7a' opacity='0.2'%3E%3Canimate attributeName='opacity' values='0.2;0.5;0.2' dur='6s' repeatCount='indefinite' begin='3s'/%3E%3C/circle%3E%3Ccircle cx='206' cy='25' r='2' fill='%23c74b7a' opacity='0.2'%3E%3Canimate attributeName='opacity' values='0.2;0.5;0.2' dur='6s' repeatCount='indefinite' begin='3.3s'/%3E%3C/circle%3E%3Ccircle cx='216' cy='25' r='2' fill='%23c74b7a' opacity='0.2'%3E%3Canimate attributeName='opacity' values='0.2;0.5;0.2' dur='6s' repeatCount='indefinite' begin='3.6s'/%3E%3C/circle%3E%3C/svg%3E") !important;
    }

    /* 底部微光条：降为静态低透明度 */
    .flex.items-center.justify-center.w-6.h-5::after {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='2'%3E%3Cdefs%3E%3ClinearGradient id='lg' x1='0' y1='0' x2='1' y2='0'%3E%3Cstop offset='0%25' stop-color='%237ba7d9' stop-opacity='0'/%3E%3Cstop offset='25%25' stop-color='%237ba7d9' stop-opacity='0.3'/%3E%3Cstop offset='50%25' stop-color='%23d98aab' stop-opacity='0.4'/%3E%3Cstop offset='75%25' stop-color='%23b08ad9' stop-opacity='0.3'/%3E%3Cstop offset='100%25' stop-color='%23b08ad9' stop-opacity='0'/%3E%3C/linearGradient%3E%3C/defs%3E%3Crect width='200' height='2' fill='url(%23lg)' opacity='0.3'/%3E%3C/svg%3E") !important;
    }

    /* 悬停效果：去掉过渡动画 */
    .bg-gray-100\/90.relative.inline-block {
        transition: none !important;
    }
}

/* === 10. 滚动条美化（深色适配）=== */
.markdown-body::-webkit-scrollbar {
    width: 5px !important;
}

.markdown-body::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.1) !important;
    border-radius: 3px !important;
}

.markdown-body::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, #7ba7d9, #c74b7a, #b08ad9) !important;
    border-radius: 3px !important;
}

.markdown-body::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(180deg, #8bb7e9, #d75b8a, #c09ae9) !important;
}

/* ============================================
   完整小屏适配 · 平板 → 手机 → 窄屏
   ============================================ */

/* === 平板竖屏 & 大屏手机 (≤768px) === */
@media (max-width: 768px) {
    .bg-gray-100\/90.relative.inline-block {
        border-radius: 14px !important;
        padding: 14px 12px !important;
        margin-left: 4px !important;
        margin-right: 4px !important;
        box-shadow:
            0 0 0 1px rgba(180, 100, 140, 0.08),
            0 4px 16px rgba(0, 0, 0, 0.5),
            0 8px 32px rgba(100, 50, 80, 0.12),
            inset 0 1px 0 rgba(255, 255, 255, 0.03) !important;
    }

    .markdown-body {
        font-size: 0.95em !important;
        line-height: 1.75 !important;
    }

    .markdown-body pre {
        padding: 10px !important;
        font-size: 0.88em !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
    }

    .markdown-body table {
        display: block !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
        white-space: nowrap !important;
    }

    .markdown-body blockquote {
        padding: 6px 10px !important;
        margin: 6px 0 !important;
    }

    /* 加载动画容器 */
    .flex.items-center.justify-center.w-6.h-5 {
        width: 260px !important;
        height: 46px !important;
        min-height: 46px !important;
    }

    .flex.items-center.justify-center.w-6.h-5::before {
        width: 240px !important;
        height: 38px !important;
    }

    /* 底部元素间距收紧 */
    .MuiButtonBase-root.MuiButton-root.MuiButton-text.MuiButton-textPrimary {
        font-size: 0.78em !important;
        padding: 4px 6px !important;
    }

    .MuiTypography-root.MuiTypography-body2.css-6c0gf2 {
        font-size: 0.74em !important;
    }

    .text-orange-500 {
        font-size: 0.76em !important;
    }
}

/* === 标准手机 (≤480px) === */
@media (max-width: 480px) {
    .bg-gray-100\/90.relative.inline-block {
        border-radius: 12px !important;
        padding: 10px 8px !important;
        margin-left: 2px !important;
        margin-right: 2px !important;
        /* 小屏降低模糊强度节省性能 */
        backdrop-filter: blur(10px) !important;
        box-shadow:
            0 0 0 1px rgba(180, 100, 140, 0.06),
            0 3px 12px rgba(0, 0, 0, 0.45),
            0 6px 24px rgba(100, 50, 80, 0.1) !important;
    }

    /* 星尘粒子：缩小平铺尺寸 + 降低透明度省性能 */
    .bg-gray-100\/90.relative.inline-block::before {
        background-size: 200px 200px !important;
        opacity: 0.3 !important;
    }

    /* 扫描线：小屏进一步降低可见度 */
    .bg-gray-100\/90.relative.inline-block::after {
        opacity: 0.03 !important;
    }

    .markdown-body {
        font-size: 0.9em !important;
        line-height: 1.7 !important;
        letter-spacing: 0.01em !important;
    }

    .markdown-body pre {
        padding: 8px !important;
        font-size: 0.82em !important;
        border-radius: 8px !important;
    }

    .markdown-body code {
        font-size: 0.85em !important;
        padding: 1px 4px !important;
    }

    .markdown-body blockquote {
        padding: 5px 8px !important;
        border-left-width: 2px !important;
    }

    .markdown-body h1 { font-size: 1.3em !important; }
    .markdown-body h2 { font-size: 1.15em !important; }
    .markdown-body h3 { font-size: 1.05em !important; }

    .markdown-body th,
    .markdown-body td {
        padding: 4px 6px !important;
        font-size: 0.85em !important;
    }

    /* 加载动画：缩小适配 + 字号降级 */
    .flex.items-center.justify-center.w-6.h-5 {
        width: 220px !important;
        height: 42px !important;
        min-height: 42px !important;
    }

    .flex.items-center.justify-center.w-6.h-5::before {
        width: 200px !important;
        height: 34px !important;
        /* 小屏版SVG：字号缩至13px，间距收紧 */
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 220 36' width='220' height='36'%3E%3Cdefs%3E%3Cfilter id='g1m' x='-50%25' y='-50%25' width='200%25' height='200%25'%3E%3CfeGaussianBlur stdDeviation='1.5' result='b'/%3E%3CfeMerge%3E%3CfeMergeNode in='b'/%3E%3CfeMergeNode in='SourceGraphic'/%3E%3C/feMerge%3E%3C/filter%3E%3Cfilter id='g2m' x='-50%25' y='-50%25' width='200%25' height='200%25'%3E%3CfeGaussianBlur stdDeviation='1.5' result='b'/%3E%3CfeMerge%3E%3CfeMergeNode in='b'/%3E%3CfeMergeNode in='SourceGraphic'/%3E%3C/feMerge%3E%3C/filter%3E%3Cfilter id='g3m' x='-50%25' y='-50%25' width='200%25' height='200%25'%3E%3CfeGaussianBlur stdDeviation='1.5' result='b'/%3E%3CfeMerge%3E%3CfeMergeNode in='b'/%3E%3CfeMergeNode in='SourceGraphic'/%3E%3C/feMerge%3E%3C/filter%3E%3C/defs%3E%3Ctext x='6' y='24' font-family='sans-serif' font-weight='bold' font-size='13' fill='%237ba7d9' opacity='0' filter='url(%23g1m)'%3E%3Canimate attributeName='opacity' values='0;0;1;1;1;0.3;0' dur='4s' repeatCount='indefinite' begin='0s'/%3E%3CanimateTransform attributeName='transform' type='translate' values='0 5;0 5;0 0;0 0;0 0;0 1;0 5' dur='4s' repeatCount='indefinite' begin='0s'/%3E眼%3C/text%3E%3Ctext x='22' y='24' font-family='sans-serif' font-weight='bold' font-size='13' fill='%237ba7d9' opacity='0' filter='url(%23g1m)'%3E%3Canimate attributeName='opacity' values='0;0;1;1;1;0.3;0' dur='4s' repeatCount='indefinite' begin='0.2s'/%3E%3CanimateTransform attributeName='transform' type='translate' values='0 5;0 5;0 0;0 0;0 0;0 1;0 5' dur='4s' repeatCount='indefinite' begin='0.2s'/%3E睛%3C/text%3E%3Ctext x='38' y='24' font-family='sans-serif' font-weight='bold' font-size='13' fill='%23d98aab' opacity='0' filter='url(%23g2m)'%3E%3Canimate attributeName='opacity' values='0;0;1;1;1;0.3;0' dur='4s' repeatCount='indefinite' begin='0.4s'/%3E%3CanimateTransform attributeName='transform' type='translate' values='0 5;0 5;0 0;0 0;0 0;0 1;0 5' dur='4s' repeatCount='indefinite' begin='0.4s'/%3E们%3C/text%3E%3Ctext x='54' y='24' font-family='sans-serif' font-weight='bold' font-size='13' fill='%23d98aab' opacity='0' filter='url(%23g2m)'%3E%3Canimate attributeName='opacity' values='0;0;1;1;1;0.3;0' dur='4s' repeatCount='indefinite' begin='0.6s'/%3E%3CanimateTransform attributeName='transform' type='translate' values='0 5;0 5;0 0;0 0;0 0;0 1;0 5' dur='4s' repeatCount='indefinite' begin='0.6s'/%3E一%3C/text%3E%3Ctext x='70' y='24' font-family='sans-serif' font-weight='bold' font-size='13' fill='%23b08ad9' opacity='0' filter='url(%23g3m)'%3E%3Canimate attributeName='opacity' values='0;0;1;1;1;0.3;0' dur='4s' repeatCount='indefinite' begin='0.8s'/%3E%3CanimateTransform attributeName='transform' type='translate' values='0 5;0 5;0 0;0 0;0 0;0 1;0 5' dur='4s' repeatCount='indefinite' begin='0.8s'/%3E直%3C/text%3E%3Ctext x='86' y='24' font-family='sans-serif' font-weight='bold' font-size='13' fill='%23b08ad9' opacity='0' filter='url(%23g3m)'%3E%3Canimate attributeName='opacity' values='0;0;1;1;1;0.3;0' dur='4s' repeatCount='indefinite' begin='1.0s'/%3E%3CanimateTransform attributeName='transform' type='translate' values='0 5;0 5;0 0;0 0;0 0;0 1;0 5' dur='4s' repeatCount='indefinite' begin='1.0s'/%3E在%3C/text%3E%3Ctext x='102' y='24' font-family='sans-serif' font-weight='bold' font-size='13' fill='%237ba7d9' opacity='0' filter='url(%23g1m)'%3E%3Canimate attributeName='opacity' values='0;0;1;1;1;0.3;0' dur='4s' repeatCount='indefinite' begin='1.2s'/%3E%3CanimateTransform attributeName='transform' type='translate' values='0 5;0 5;0 0;0 0;0 0;0 1;0 5' dur='4s' repeatCount='indefinite' begin='1.2s'/%3E等%3C/text%3E%3Ctext x='118' y='24' font-family='sans-serif' font-weight='bold' font-size='13' fill='%23d98aab' opacity='0' filter='url(%23g2m)'%3E%3Canimate attributeName='opacity' values='0;0;1;1;1;0.3;0' dur='4s' repeatCount='indefinite' begin='1.4s'/%3E%3CanimateTransform attributeName='transform' type='translate' values='0 5;0 5;0 0;0 0;0 0;0 1;0 5' dur='4s' repeatCount='indefinite' begin='1.4s'/%3E着%3C/text%3E%3Ctext x='134' y='24' font-family='sans-serif' font-weight='bold' font-size='13' fill='%23b08ad9' opacity='0' filter='url(%23g3m)'%3E%3Canimate attributeName='opacity' values='0;0;1;1;1;0.3;0' dur='4s' repeatCount='indefinite' begin='1.6s'/%3E%3CanimateTransform attributeName='transform' type='translate' values='0 5;0 5;0 0;0 0;0 0;0 1;0 5' dur='4s' repeatCount='indefinite' begin='1.6s'/%3E你%3C/text%3E%3Ccircle cx='156' cy='21' r='2' fill='%23c74b7a' opacity='0'%3E%3Canimate attributeName='opacity' values='0;0;1;1;0.4;0' dur='4s' repeatCount='indefinite' begin='2.0s'/%3E%3Canimate attributeName='r' values='0.8;0.8;2;2.5;1.5;0.8' dur='4s' repeatCount='indefinite' begin='2.0s'/%3E%3C/circle%3E%3Ccircle cx='164' cy='21' r='2' fill='%23c74b7a' opacity='0'%3E%3Canimate attributeName='opacity' values='0;0;1;1;0.4;0' dur='4s' repeatCount='indefinite' begin='2.3s'/%3E%3Canimate attributeName='r' values='0.8;0.8;2;2.5;1.5;0.8' dur='4s' repeatCount='indefinite' begin='2.3s'/%3E%3C/circle%3E%3Ccircle cx='172' cy='21' r='2' fill='%23c74b7a' opacity='0'%3E%3Canimate attributeName='opacity' values='0;0;1;1;0.4;0' dur='4s' repeatCount='indefinite' begin='2.6s'/%3E%3Canimate attributeName='r' values='0.8;0.8;2;2.5;1.5;0.8' dur='4s' repeatCount='indefinite' begin='2.6s'/%3E%3C/circle%3E%3C/svg%3E") !important;
    }

    /* 底部微光条收窄 */
    .flex.items-center.justify-center.w-6.h-5::after {
        left: 15% !important;
        width: 70% !important;
    }

    /* 底部按钮：小屏紧凑排列 */
    .MuiButtonBase-root.MuiButton-root.MuiButton-text.MuiButton-textPrimary {
        font-size: 0.72em !important;
        padding: 3px 4px !important;
        min-width: unset !important;
    }

    .MuiTypography-root.MuiTypography-body2.css-6c0gf2 {
        font-size: 0.7em !important;
    }

    .text-orange-500 {
        font-size: 0.72em !important;
    }

    /* 滚动条更细 */
    .markdown-body::-webkit-scrollbar {
        width: 3px !important;
    }
}

/* === 窄屏手机 / 折叠屏内屏 (≤360px) === */
@media (max-width: 360px) {
    .bg-gray-100\/90.relative.inline-block {
        border-radius: 10px !important;
        padding: 8px 6px !important;
        margin-left: 1px !important;
        margin-right: 1px !important;
        /* 窄屏关闭模糊以保性能 */
        backdrop-filter: blur(6px) !important;
    }

    /* 窄屏星尘进一步缩小 */
    .bg-gray-100\/90.relative.inline-block::before {
        background-size: 150px 150px !important;
        opacity: 0.2 !important;
    }

    /* 窄屏关闭扫描线 */
    .bg-gray-100\/90.relative.inline-block::after {
        display: none !important;
    }

    .markdown-body {
        font-size: 0.85em !important;
        line-height: 1.65 !important;
    }

    .markdown-body pre {
        padding: 6px !important;
        font-size: 0.78em !important;
        border-radius: 6px !important;
    }

    .markdown-body h1 { font-size: 1.2em !important; }
    .markdown-body h2 { font-size: 1.08em !important; }
    .markdown-body h3 { font-size: 1em !important; }

    /* 加载动画：窄屏进一步缩小 */
    .flex.items-center.justify-center.w-6.h-5 {
        width: 190px !important;
        height: 38px !important;
        min-height: 38px !important;
    }

    .flex.items-center.justify-center.w-6.h-5::before {
        width: 175px !important;
        height: 30px !important;
        /* 窄屏版SVG：字号11px，去掉光晕滤镜省性能 */
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 180 30' width='180' height='30'%3E%3Ctext x='4' y='20' font-family='sans-serif' font-weight='bold' font-size='11' fill='%237ba7d9' opacity='0'%3E%3Canimate attributeName='opacity' values='0;1;1;0.3;0' dur='3.5s' repeatCount='indefinite' begin='0s'/%3E眼%3C/text%3E%3Ctext x='17' y='20' font-family='sans-serif' font-weight='bold' font-size='11' fill='%237ba7d9' opacity='0'%3E%3Canimate attributeName='opacity' values='0;1;1;0.3;0' dur='3.5s' repeatCount='indefinite' begin='0.2s'/%3E睛%3C/text%3E%3Ctext x='30' y='20' font-family='sans-serif' font-weight='bold' font-size='11' fill='%23d98aab' opacity='0'%3E%3Canimate attributeName='opacity' values='0;1;1;0.3;0' dur='3.5s' repeatCount='indefinite' begin='0.4s'/%3E们%3C/text%3E%3Ctext x='43' y='20' font-family='sans-serif' font-weight='bold' font-size='11' fill='%23d98aab' opacity='0'%3E%3Canimate attributeName='opacity' values='0;1;1;0.3;0' dur='3.5s' repeatCount='indefinite' begin='0.6s'/%3E一%3C/text%3E%3Ctext x='56' y='20' font-family='sans-serif' font-weight='bold' font-size='11' fill='%23b08ad9' opacity='0'%3E%3Canimate attributeName='opacity' values='0;1;1;0.3;0' dur='3.5s' repeatCount='indefinite' begin='0.8s'/%3E直%3C/text%3E%3Ctext x='69' y='20' font-family='sans-serif' font-weight='bold' font-size='11' fill='%23b08ad9' opacity='0'%3E%3Canimate attributeName='opacity' values='0;1;1;0.3;0' dur='3.5s' repeatCount='indefinite' begin='1.0s'/%3E在%3C/text%3E%3Ctext x='82' y='20' font-family='sans-serif' font-weight='bold' font-size='11' fill='%237ba7d9' opacity='0'%3E%3Canimate attributeName='opacity' values='0;1;1;0.3;0' dur='3.5s' repeatCount='indefinite' begin='1.2s'/%3E等%3C/text%3E%3Ctext x='95' y='20' font-family='sans-serif' font-weight='bold' font-size='11' fill='%23d98aab' opacity='0'%3E%3Canimate attributeName='opacity' values='0;1;1;0.3;0' dur='3.5s' repeatCount='indefinite' begin='1.4s'/%3E着%3C/text%3E%3Ctext x='108' y='20' font-family='sans-serif' font-weight='bold' font-size='11' fill='%23b08ad9' opacity='0'%3E%3Canimate attributeName='opacity' values='0;1;1;0.3;0' dur='3.5s' repeatCount='indefinite' begin='1.6s'/%3E你%3C/text%3E%3Ccircle cx='126' cy='17' r='1.5' fill='%23c74b7a' opacity='0'%3E%3Canimate attributeName='opacity' values='0;1;0.4;0' dur='3.5s' repeatCount='indefinite' begin='2.0s'/%3E%3C/circle%3E%3Ccircle cx='133' cy='17' r='1.5' fill='%23c74b7a' opacity='0'%3E%3Canimate attributeName='opacity' values='0;1;0.4;0' dur='3.5s' repeatCount='indefinite' begin='2.3s'/%3E%3C/circle%3E%3Ccircle cx='140' cy='17' r='1.5' fill='%23c74b7a' opacity='0'%3E%3Canimate attributeName='opacity' values='0;1;0.4;0' dur='3.5s' repeatCount='indefinite' begin='2.6s'/%3E%3C/circle%3E%3C/svg%3E") !important;
    }

    /* 底部元素极限紧凑 */
    .MuiButtonBase-root.MuiButton-root.MuiButton-text.MuiButton-textPrimary {
        font-size: 0.68em !important;
        padding: 2px 3px !important;
    }

    .MuiTypography-root.MuiTypography-body2.css-6c0gf2 {
        font-size: 0.66em !important;
    }

    .text-orange-500 {
        font-size: 0.68em !important;
    }
}

/* === 横屏手机 (高度≤420px 且 横向) === */
@media (max-height: 420px) and (orientation: landscape) {
    .bg-gray-100\/90.relative.inline-block {
        border-radius: 10px !important;
        padding: 8px 10px !important;
        max-height: 85vh !important;
        overflow-y: auto !important;
    }

    .markdown-body {
        font-size: 0.88em !important;
        line-height: 1.6 !important;
    }

    /* 横屏加载动画居左，不占太多纵向空间 */
    .flex.items-center.justify-center.w-6.h-5 {
        height: 36px !important;
        min-height: 36px !important;
        justify-content: flex-start !important;
    }
}

/* ============================================
   星尘与眼瞳 · 配套界面美化
   顶部栏 / 底部栏 / 分页栏 / 评论区
   ============================================ */

/* ──────────────────────────────────
   1. 顶部栏
   ────────────────────────────────── */

/* 主容器：深色毛玻璃 */
.sticky.w-full.top-0.flex.items-center {
    background: linear-gradient(
        135deg,
        rgba(18, 12, 22, 0.94),
        rgba(28, 16, 34, 0.90),
        rgba(20, 14, 26, 0.94)
    ) !important;
    border-bottom: 1px solid rgba(180, 100, 140, 0.18) !important;
    backdrop-filter: blur(14px) saturate(1.15) !important;
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.03),
        0 4px 20px rgba(0, 0, 0, 0.5) !important;
    transition: border-color 0.3s ease, box-shadow 0.3s ease !important;
}

.sticky.w-full.top-0.flex.items-center:hover {
    border-bottom-color: rgba(200, 120, 160, 0.32) !important;
}

/* 模型选择器容器 */
#ai-model-selector .group.flex.items-center {
    background: rgba(180, 100, 140, 0.08) !important;
    border: 1px solid rgba(180, 100, 140, 0.18) !important;
    border-radius: 10px !important;
    padding: 4px 10px !important;
    transition: background 0.25s, border-color 0.25s, box-shadow 0.25s !important;
}

#ai-model-selector .group.flex.items-center:hover {
    background: rgba(180, 100, 140, 0.14) !important;
    border-color: rgba(217, 138, 171, 0.35) !important;
    box-shadow: 0 0 16px rgba(199, 75, 122, 0.12) !important;
}

/* 模型名称文字 */
#ai-model-selector .truncate.text-\[13px\] {
    color: #E0D0E8 !important;
    font-family: "Microsoft YaHei", -apple-system, "Segoe UI", sans-serif !important;
    font-weight: 500 !important;
    letter-spacing: 0.03em !important;
    text-shadow: 0 0 8px rgba(176, 138, 217, 0.15) !important;
}

/* 下拉箭头 */
#ai-model-selector .shrink-0.flex.items-center svg {
    color: rgba(217, 138, 171, 0.6) !important;
    transition: color 0.25s, transform 0.3s !important;
}

#ai-model-selector .group.flex.items-center:hover .shrink-0.flex.items-center svg {
    color: rgba(217, 138, 171, 0.9) !important;
    transform: translateY(1px) !important;
}

/* 设置按钮 */
#header-setting-button {
    color: rgba(200, 180, 210, 0.6) !important;
    border-radius: 8px !important;
    transition: color 0.25s, background 0.25s, box-shadow 0.25s !important;
}

#header-setting-button:hover {
    color: #d98aab !important;
    background: rgba(180, 100, 140, 0.1) !important;
    box-shadow: 0 0 14px rgba(199, 75, 122, 0.12) !important;
}


/* ──────────────────────────────────
   2. 开场白选择器
   ────────────────────────────────── */

div.flex.items-center.h-9.bg-white.rounded-md.cursor-pointer.group[class*="border-gray"] {
    background: linear-gradient(
        135deg,
        rgba(22, 14, 28, 0.88),
        rgba(32, 20, 38, 0.84)
    ) !important;
    border: 1px solid rgba(180, 100, 140, 0.2) !important;
    border-radius: 10px !important;
    box-shadow:
        0 2px 10px rgba(0, 0, 0, 0.3),
        inset 0 1px 0 rgba(255, 255, 255, 0.03) !important;
    transition: border-color 0.25s, box-shadow 0.25s !important;
}

div.flex.items-center.h-9.bg-white.rounded-md.cursor-pointer.group[class*="border-gray"]:hover {
    border-color: rgba(217, 138, 171, 0.4) !important;
    box-shadow:
        0 2px 10px rgba(0, 0, 0, 0.3),
        0 0 20px rgba(199, 75, 122, 0.1),
        inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
}

/* 左侧滑块图标 */
div.flex.items-center.h-9.cursor-pointer.group svg[data-icon="SlidersH"] {
    color: rgba(176, 138, 217, 0.65) !important;
    transition: color 0.25s !important;
}

div.flex.items-center.h-9.cursor-pointer.group:hover svg[data-icon="SlidersH"] {
    color: rgba(176, 138, 217, 0.95) !important;
}

/* 右侧下拉箭头 */
div.flex.items-center.h-9.cursor-pointer.group svg[data-icon="ChevronDown"] {
    color: rgba(217, 138, 171, 0.5) !important;
    transition: color 0.25s, transform 0.3s !important;
}

div.flex.items-center.h-9.cursor-pointer.group:hover svg[data-icon="ChevronDown"] {
    color: rgba(217, 138, 171, 0.85) !important;
    transform: translateY(1px) !important;
}


/* ──────────────────────────────────
   3. 底部栏
   ────────────────────────────────── */

/* 底部渐变背景 */
.bg-gradient-to-t {
    background: linear-gradient(
        to top,
        rgba(18, 12, 22, 0.98),
        rgba(18, 12, 22, 0.85),
        transparent
    ) !important;
}

/* 输入框容器 */
#ai-chat-bottom-input {
    background: linear-gradient(
        145deg,
        rgba(24, 16, 30, 0.92),
        rgba(34, 22, 40, 0.88)
    ) !important;
    border: 1px solid rgba(180, 100, 140, 0.22) !important;
    border-radius: 14px !important;
    box-shadow:
        0 0 0 1px rgba(180, 100, 140, 0.06),
        0 4px 20px rgba(0, 0, 0, 0.45),
        inset 0 1px 0 rgba(255, 255, 255, 0.03) !important;
    backdrop-filter: blur(12px) !important;
    transition: border-color 0.3s, box-shadow 0.3s !important;
}

#ai-chat-bottom-input:focus-within {
    border-color: rgba(199, 75, 122, 0.45) !important;
    box-shadow:
        0 0 0 1px rgba(199, 75, 122, 0.12),
        0 4px 20px rgba(0, 0, 0, 0.45),
        0 0 30px rgba(199, 75, 122, 0.08),
        inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
}

/* 主输入框 */
#ai-chat-input {
    color: #E0D4E8 !important;
    font-family: "Microsoft YaHei", -apple-system, "Segoe UI", sans-serif !important;
    background: transparent !important;
    caret-color: #d98aab !important;
    letter-spacing: 0.02em !important;
}

#ai-chat-input::placeholder {
    color: rgba(200, 180, 210, 0.35) !important;
    font-style: italic !important;
}

#ai-chat-input::selection {
    background: rgba(199, 75, 122, 0.3) !important;
    color: #f0e0f4 !important;
}


/* ──────────────────────────────────
   4. 分页栏（仅颜色/视觉）
   ────────────────────────────────── */

.MuiPaginationItem-root {
    color: rgba(200, 180, 210, 0.65) !important;
    border-color: rgba(180, 100, 140, 0.2) !important;
    background: rgba(24, 16, 30, 0.6) !important;
    transition: color 0.25s, background 0.25s, border-color 0.25s, box-shadow 0.25s !important;
}

.MuiPaginationItem-root:hover {
    color: #E0D0E8 !important;
    background: rgba(180, 100, 140, 0.12) !important;
    border-color: rgba(217, 138, 171, 0.35) !important;
    box-shadow: 0 0 10px rgba(199, 75, 122, 0.1) !important;
}

.MuiPaginationItem-root.Mui-selected {
    color: #f0e0f4 !important;
    background: linear-gradient(135deg, rgba(199, 75, 122, 0.35), rgba(176, 138, 217, 0.25)) !important;
    border-color: rgba(199, 75, 122, 0.45) !important;
    box-shadow: 0 0 16px rgba(199, 75, 122, 0.15) !important;
}

.MuiPaginationItem-root.Mui-disabled {
    color: rgba(200, 180, 210, 0.2) !important;
    border-color: rgba(180, 100, 140, 0.08) !important;
    background: rgba(24, 16, 30, 0.3) !important;
}

.MuiPaginationItem-icon {
    color: rgba(217, 138, 171, 0.5) !important;
    transition: color 0.25s !important;
}

.MuiPaginationItem-root:hover .MuiPaginationItem-icon {
    color: rgba(217, 138, 171, 0.9) !important;
}

/* 跳转输入区域 */
.MuiStack-root.css-1uwir8f {
    background: rgba(24, 16, 30, 0.5) !important;
    border-radius: 8px !important;
}

.MuiStack-root.css-1uwir8f .MuiBox-root {
    color: rgba(200, 180, 210, 0.55) !important;
    font-family: "Microsoft YaHei", -apple-system, "Segoe UI", sans-serif !important;
}

.MuiInputBase-input {
    color: #E0D0E8 !important;
    background: rgba(180, 100, 140, 0.06) !important;
    border: 1px solid rgba(180, 100, 140, 0.18) !important;
    border-radius: 6px !important;
    caret-color: #d98aab !important;
    transition: border-color 0.25s !important;
}

.MuiInputBase-input:focus {
    border-color: rgba(199, 75, 122, 0.4) !important;
}


/* ──────────────────────────────────
   5. 评论区
   ────────────────────────────────── */

/* 背景容器 */
div[class*="w-full"][class*="bg-white"][class*="bottom-0"] {
    background: linear-gradient(
        170deg,
        rgba(18, 12, 22, 0.96),
        rgba(26, 16, 32, 0.94),
        rgba(20, 14, 26, 0.96)
    ) !important;
    border-top: 1px solid rgba(180, 100, 140, 0.15) !important;
}

/* 顶部标题「评论(x)」 */
div.text-lg.font-bold {
    color: #E0D0E8 !important;
    font-family: "Microsoft YaHei", -apple-system, "Segoe UI", sans-serif !important;
    text-shadow: 0 0 12px rgba(176, 138, 217, 0.12) !important;
}

/* 「个人评分」文字 */
p.MuiTypography-body1.text-grey-600 {
    color: rgba(200, 180, 210, 0.6) !important;
}

/* 评分容器 */
span.MuiRating-root {
    filter: drop-shadow(0 0 4px rgba(199, 75, 122, 0.15)) !important;
}

/* 空心星星 */
span.MuiRating-iconEmpty svg {
    color: rgba(180, 100, 140, 0.25) !important;
    transition: color 0.2s !important;
}

span.MuiRating-root:hover span.MuiRating-iconEmpty svg {
    color: rgba(180, 100, 140, 0.4) !important;
}

/* 选中星星 */
span.MuiRating-iconFilled svg {
    color: #d98aab !important;
    filter: drop-shadow(0 0 6px rgba(217, 138, 171, 0.4)) !important;
}

/* 评分数字 */
span.text-orange-500 {
    color: rgba(217, 160, 120, 0.85) !important;
    text-shadow: 0 0 6px rgba(217, 160, 120, 0.2) !important;
}

/* 评论输入框容器 */
div.flex.flex-col.border-gray-200 {
    border-color: rgba(180, 100, 140, 0.18) !important;
    border-radius: 12px !important;
    background: rgba(24, 16, 30, 0.5) !important;
    transition: border-color 0.3s !important;
}

div.flex.flex-col.border-gray-200:focus-within {
    border-color: rgba(199, 75, 122, 0.38) !important;
}

/* 评论输入框 */
textarea.rc-textarea {
    color: #E0D4E8 !important;
    background: transparent !important;
    font-family: "Microsoft YaHei", -apple-system, "Segoe UI", sans-serif !important;
    caret-color: #d98aab !important;
}

/* 字数统计 */
div.bg-gray-100.text-gray-500 {
    background: rgba(180, 100, 140, 0.06) !important;
    color: rgba(200, 180, 210, 0.4) !important;
    border-radius: 0 0 12px 12px !important;
}

/* 发送评论按钮 */
div.cursor-pointer.group.flex.items-center.justify-center {
    transition: transform 0.2s, filter 0.2s !important;
}

div.cursor-pointer.group.flex.items-center.justify-center:hover {
    transform: scale(1.08) !important;
    filter: drop-shadow(0 0 8px rgba(199, 75, 122, 0.3)) !important;
}

/* 发送图标 */
div[data-state="closed"] svg[data-icon="Send03"] {
    color: rgba(217, 138, 171, 0.6) !important;
    transition: color 0.25s !important;
}

div.cursor-pointer.group:hover svg[data-icon="Send03"] {
    color: #d98aab !important;
}

/* 分割线 */
div.style_divider__mW0YX {
    background: linear-gradient(
        90deg,
        transparent,
        rgba(180, 100, 140, 0.25),
        rgba(176, 138, 217, 0.2),
        transparent
    ) !important;
}

/* 排序按钮容器 */
.MuiStack-root.css-1dmzxoz {
    background: transparent !important;
}

/* 排序按钮（通用基础） */
button.MuiButton-containedPrimary,
button.MuiButton-outlinedPrimary {
    border-radius: 8px !important;
    font-family: "Microsoft YaHei", -apple-system, "Segoe UI", sans-serif !important;
    font-size: 0.82em !important;
    transition: all 0.25s ease !important;
}

/* 排序按钮（已选中） */
button.MuiButton-containedPrimary {
    background: linear-gradient(135deg, rgba(199, 75, 122, 0.4), rgba(176, 138, 217, 0.3)) !important;
    color: #f0e0f4 !important;
    border: 1px solid rgba(199, 75, 122, 0.4) !important;
    box-shadow: 0 0 14px rgba(199, 75, 122, 0.12) !important;
}

/* 排序按钮（未选中） */
button.MuiButton-outlinedPrimary {
    background: rgba(24, 16, 30, 0.4) !important;
    color: rgba(200, 180, 210, 0.6) !important;
    border: 1px solid rgba(180, 100, 140, 0.18) !important;
}

button.MuiButton-outlinedPrimary:hover {
    background: rgba(180, 100, 140, 0.1) !important;
    color: #E0D0E8 !important;
    border-color: rgba(217, 138, 171, 0.35) !important;
}

/* 评论列表容器 */
div.p-3.overflow-y-auto {
    scrollbar-width: thin !important;
    scrollbar-color: rgba(199, 75, 122, 0.25) transparent !important;
}

div.p-3.overflow-y-auto::-webkit-scrollbar {
    width: 4px !important;
}

div.p-3.overflow-y-auto::-webkit-scrollbar-track {
    background: transparent !important;
}

div.p-3.overflow-y-auto::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, #7ba7d9, #c74b7a, #b08ad9) !important;
    border-radius: 3px !important;
}

/* 评论项 */
div.group.ml-0 {
    border-bottom: 1px solid rgba(180, 100, 140, 0.08) !important;
    transition: background 0.25s !important;
}

div.group.ml-0:hover {
    background: rgba(180, 100, 140, 0.04) !important;
}

/* 用户头像光环 */
div.group img.rounded-full {
    box-shadow: 0 0 0 2px rgba(180, 100, 140, 0.2), 0 0 10px rgba(199, 75, 122, 0.1) !important;
    transition: box-shadow 0.25s !important;
}

div.group.ml-0:hover img.rounded-full {
    box-shadow: 0 0 0 2px rgba(217, 138, 171, 0.4), 0 0 16px rgba(199, 75, 122, 0.2) !important;
}

/* 用户名 */
div.text-sm.text-grey-600 span.font-bold {
    color: #d9b3c7 !important;
    text-shadow: 0 0 6px rgba(217, 138, 171, 0.1) !important;
}

/* （你）标签 */
span.text-\[10px\] {
    color: rgba(176, 138, 217, 0.7) !important;
    background: rgba(176, 138, 217, 0.1) !important;
    border-radius: 4px !important;
    padding: 1px 4px !important;
}

/* 评论内容 */
div.break-all {
    color: #D8CDE0 !important;
    line-height: 1.7 !important;
}

/* 时间戳 */
div.text-xs.text-grey-600 {
    color: rgba(200, 180, 210, 0.35) !important;
}

/* 点赞按钮 */
button.text-gray-400 {
    color: rgba(200, 180, 210, 0.35) !important;
    transition: color 0.2s, transform 0.2s !important;
}

button.text-gray-400:hover {
    color: #d98aab !important;
    transform: scale(1.15) !important;
}

button.text-gray-400 svg {
    transition: filter 0.2s !important;
}

button.text-gray-400:hover svg {
    filter: drop-shadow(0 0 6px rgba(217, 138, 171, 0.4)) !important;
}

/* 回复文字 */
span.cursor-pointer {
    color: rgba(123, 167, 217, 0.55) !important;
    transition: color 0.2s !important;
}

span.cursor-pointer:hover {
    color: #7ba7d9 !important;
    text-shadow: 0 0 8px rgba(123, 167, 217, 0.25) !important;
}

/* 回复区域边框 */
div.ml-8.border-l {
    border-left-color: rgba(176, 138, 217, 0.2) !important;
    transition: border-left-color 0.25s !important;
}

div.ml-8.border-l:hover {
    border-left-color: rgba(176, 138, 217, 0.4) !important;
}


/* ──────────────────────────────────
   6. 评论区移动端适配
   ────────────────────────────────── */

@media (max-width: 480px) {
    div.text-lg.font-bold {
        font-size: 1em !important;
    }

    button.MuiButton-containedPrimary,
    button.MuiButton-outlinedPrimary {
        font-size: 0.74em !important;
        border-radius: 6px !important;
    }

    div.break-all {
        font-size: 0.9em !important;
        line-height: 1.65 !important;
    }

    div.flex.flex-col.border-gray-200 {
        border-radius: 10px !important;
    }

    #ai-chat-bottom-input {
        border-radius: 12px !important;
        backdrop-filter: blur(8px) !important;
    }
}

@media (max-width: 360px) {
    #ai-chat-bottom-input {
        border-radius: 10px !important;
        backdrop-filter: blur(6px) !important;
    }

    div.break-all {
        font-size: 0.85em !important;
    }
}

/* ──────────────────────────────────
   7. 低动效偏好
   ────────────────────────────────── */

@media (prefers-reduced-motion: reduce) {
    .sticky.w-full.top-0.flex.items-center,
    #ai-model-selector .group.flex.items-center,
    #ai-chat-bottom-input,
    div.group.ml-0,
    button.text-gray-400,
    div.cursor-pointer.group.flex.items-center.justify-center {
        transition: none !important;
    }
}

/* 仅为输入栏添加独立背景色 - 不影响其他样式 */
#ai-chat-input {
  /* 自定义背景色 - 半透明深紫粉色调，匹配整体风格 */
  background: rgba(40, 20, 35, 0.6) !important;
  /* 可选：添加轻微的内边框增强视觉效果 */
  border-radius: 8px !important;
  padding: 4px 8px !important;
}
/* 如果需要修改输入栏容器的背景色（外层框），使用这个规则 */
#ai-chat-bottom-input {
  /* 容器背景色 - 比输入框稍浅一点 */
  background: linear-gradient(
    145deg,
    rgba(30, 18, 38, 0.95),
    rgba(40, 25, 45, 0.9)
  ) !important;
}