职高风云录

/* 星空主题定制版 - 深空蓝紫，星光闪烁 */

/* 1. 强制隐藏顶部冗余颜色装饰条 */
[class*="bg-[#F1CBCB]"],
[class*="bg-[#c9e1e9]"] {
  display: none !important;
}

/* 2. 统一聊天框美化 (输入与输出) - 深邃星空背景 */
.bg-gray-100\/90.relative.inline-block {
  background: rgba(8, 8, 20, 0.9) !important;        /* 深空底色 */
  backdrop-filter: blur(12px) !important;
  border: 1.5px solid rgba(170, 130, 240, 0.5) !important; /* 星云紫边框 */
  border-radius: 16px !important;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.6), 0 0 20px rgba(100, 80, 200, 0.3) !important;
  padding: 12px 16px !important;
  transition: all 0.3s ease !important;
  isolation: isolate !important;
  position: relative !important;
  overflow: hidden !important;
}

.bg-gray-100\/90.relative.inline-block:hover {
  border-color: rgba(200, 160, 255, 0.8) !important;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.6), 0 0 30px rgba(140, 100, 255, 0.5) !important;
}

/* 3. 银河旋转光效 (使用::before实现) */
.bg-gray-100\/90.relative.inline-block::before {
  content: "" !important;
  position: absolute !important;
  top: -50% !important;
  left: -50% !important;
  width: 200% !important;
  height: 200% !important;
  background: conic-gradient(
    from 0deg,
    transparent 0%,
    #1a0f2e 15%,
    #3b235a 30%,
    #7e4a9e 45%,
    #b88ad0 60%,
    #7e4a9e 75%,
    #3b235a 90%,
    transparent 100%
  ) !important;
  animation: rotate AuroraRotate 12s linear infinite !important;
  z-index: -1 !important;
  opacity: 0.35 !important;
  filter: blur(6px) !important; /* 柔化光效，更像星云 */
}

/* 旋转动画 */
@keyframes AuroraRotate {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

/* 额外：用::after点缀星光 - 随机小亮点 */
.bg-gray-100\/90.relative.inline-block::after {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  background-image: 
    radial-gradient(circle at 20% 30%, rgba(255, 255, 255, 0.8) 1px, transparent 1px),
    radial-gradient(circle at 75% 15%, rgba(255, 240, 200, 0.7) 1.5px, transparent 1.5px),
    radial-gradient(circle at 45% 70%, rgba(220, 200, 255, 0.6) 1px, transparent 1px),
    radial-gradient(circle at 90% 60%, rgba(255, 255, 200, 0.5) 2px, transparent 2px),
    radial-gradient(circle at 10% 85%, rgba(210, 180, 255, 0.7) 1px, transparent 1px) !important;
  background-repeat: no-repeat !important;
  z-index: -1 !important;
  pointer-events: none !important;
  opacity: 0.6 !important;
  animation: twinkle 4s ease-in-out infinite alternate !important;
}

/* 星光闪烁动画 */
@keyframes twinkle {
  0% {
    opacity: 0.4;
  }
  100% {
    opacity: 0.9;
  }
}

/* 4. 文本内容 - 星空白 */
.markdown-body {
  color: #f0f0ff !important;          /* 冷白带一点蓝 */
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
  line-height: 1.6 !important;
  z-index: 1 !important;
  background: transparent !important;
  text-shadow: 0 0 5px rgba(180, 140, 255, 0.3) !important; /* 极淡星光晕 */
}

/* 5. 底部附加元素美化 (按钮、模型名、Token) */
/* 按钮样式 - 星尘质感 */
.MuiButtonBase-root.MuiButton-root.MuiButton-text.MuiButton-textPrimary {
  color: #e0d0ff !important;            /* 淡紫光文字 */
  background: rgba(40, 20, 60, 0.6) !important; /* 深紫透明底 */
  border-radius: 8px !important;
  margin: 2px !important;
  transition: background 0.2s !important;
  backdrop-filter: blur(4px) !important;
  border: 1px solid rgba(180, 140, 255, 0.2) !important;
}

.MuiButtonBase-root.MuiButton-root.MuiButton-text.MuiButton-textPrimary:hover {
  background: rgba(70, 40, 100, 0.8) !important;
  border-color: rgba(210, 170, 255, 0.5) !important;
}

/* 模型名称与Token消耗 - 星光色 */
.MuiTypography-root.MuiTypography-body2.css-6c0gf2,
.text-orange-500 {
  color: #b8a0e0 !important;            /* 柔紫罗兰 */
  font-weight: 500 !important;
  opacity: 0.9 !important;
  text-shadow: 0 0 4px rgba(180, 140, 255, 0.5) !important;
}

/* 6. 加载动画 - 三颗闪烁的星星 (SVG SMIL) */
.style_dot-flashing__8L91Q.style_text__zGhNq {
  display: none !important;
}

.flex.items-center.justify-center.w-6.h-5 {
  position: relative !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24'%3E%3Cdefs%3E%3Cfilter id='glow'%3E%3CfeGaussianBlur stdDeviation='1' result='coloredBlur'/%3E%3CfeMerge%3E%3CfeMergeNode in='coloredBlur'/%3E%3CfeMergeNode in='SourceGraphic'/%3E%3C/feMerge%3E%3C/filter%3E%3C/defs%3E%3Ccircle cx='4' cy='12' r='3' fill='%23fffde7' filter='url(%23glow)'%3E%3Canimate attributeName='opacity' values='0.3;1;0.3' dur='1.5s' repeatCount='indefinite' begin='0'/%3E%3C/circle%3E%3Ccircle cx='12' cy='12' r='3' fill='%23ffe484' filter='url(%23glow)'%3E%3Canimate attributeName='opacity' values='0.3;1;0.3' dur='1.5s' repeatCount='indefinite' begin='0.4s'/%3E%3C/circle%3E%3Ccircle cx='20' cy='12' r='3' fill='%23c4b0ff' filter='url(%23glow)'%3E%3Canimate attributeName='opacity' values='0.3;1;0.3' dur='1.5s' repeatCount='indefinite' begin='0.8s'/%3E%3C/circle%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: contain !important;
}

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

/* 额外：输入框焦点时的星光晕 */
.bg-gray-100\/90.relative.inline-block:focus-within {
  border-color: #b380ff !important;
  box-shadow: 0 0 0 3px rgba(150, 100, 255, 0.4), 0 8px 32px rgba(0, 0, 0, 0.6) !important;
}

/* 额外：主要操作按钮星云渐变（示例） */
.MuiButton-containedPrimary {
  background: linear-gradient(135deg, #2a1b3d, #4a2b6e) !important;
  color: #f0e6ff !important;
  border: 1px solid #8b6eb0 !important;
  box-shadow: 0 0 10px #6a4e9e !important;
}

.MuiButton-containedPrimary:hover {
  background: linear-gradient(135deg, #3e2957, #623c8a) !important;
  box-shadow: 0 0 15px #8a6ac3 !important;
}

本页只展示本地导出中可核验的公开字段。下载 JSON 可查看完整原始记录。