/* 首屏加载动画样式
 * 说明：原先内联在 index.html 的 <style> 中，Vite 的 html-inline-proxy
 * 在中文项目路径下会解析失败（No matching HTML proxy module found），
 * 故外置为 public 下的独立文件，由 index.html 用 <link> 引入。
 * public 目录内容会被 Vite 原样复制到产物根目录，不经过打包处理。
 */
#root-splash {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background:
    radial-gradient(640px 420px at 50% 36%, rgba(20, 171, 116, 0.07), transparent 70%),
    #ffffff;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'PingFang SC', 'Microsoft YaHei', sans-serif;
  animation: splash-fade-in 0.5s ease both;
}
.splash-topbar {
  position: fixed;
  top: 0; left: 0; right: 0;
  height: 3px;
  background: #14AB74;
}

/* ===== 加载动效：渐变光环 + 卫星点缀 + 微笑包裹 ===== */
.splash-spinner {
  position: relative;
  width: 110px;
  height: 110px;
  margin-bottom: 46px;
}
/* 主渐变环：品牌绿整环渐变，无灰底 */
.spinner-ring {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background: conic-gradient(
    from 0deg,
    #0e9c66 0deg,
    #14AB74 40deg,
    #6fe8ba 120deg,
    #14AB74 200deg,
    #0e9c66 280deg,
    #0e9c66 360deg
  );
  -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 5px), #000 calc(100% - 5px));
  mask: radial-gradient(farthest-side, transparent calc(100% - 5px), #000 calc(100% - 5px));
  animation: splash-spin 1.5s linear infinite;
  filter: drop-shadow(0 0 6px rgba(20, 171, 116, 0.45));
}
/* 内圈反向旋转的虚线光晕 */
.spinner-halo {
  position: absolute;
  inset: 15px;
  border-radius: 50%;
  border: 2px dashed rgba(20, 171, 116, 0.35);
  animation: splash-spin 7s linear infinite reverse;
}
/* 三颗环绕小点（不同轨道/速度/颜色） */
.spinner-dot {
  position: absolute;
  top: 50%;
  left: 50%;
  border-radius: 50%;
}
.spinner-dot.d1 {
  width: 12px; height: 12px; margin: -6px 0 0 -6px;
  background: #ffb020;
  box-shadow: 0 0 8px rgba(255, 176, 32, 0.7);
  animation: orbit-a 2.4s linear infinite;
}
.spinner-dot.d2 {
  width: 8px; height: 8px; margin: -4px 0 0 -4px;
  background: #13c2c2;
  box-shadow: 0 0 6px rgba(19, 194, 194, 0.7);
  animation: orbit-b 1.9s linear infinite;
}
.spinner-dot.d3 {
  width: 6px; height: 6px; margin: -3px 0 0 -3px;
  background: #ff7d6b;
  box-shadow: 0 0 5px rgba(255, 125, 107, 0.7);
  animation: orbit-c 2.8s linear infinite;
}
@keyframes orbit-a {
  from { transform: rotate(0deg) translateX(47px) rotate(0deg); }
  to { transform: rotate(360deg) translateX(47px) rotate(-360deg); }
}
@keyframes orbit-b {
  from { transform: rotate(120deg) translateX(38px) rotate(-120deg); }
  to { transform: rotate(480deg) translateX(38px) rotate(-480deg); }
}
@keyframes orbit-c {
  from { transform: rotate(240deg) translateX(30px) rotate(-240deg); }
  to { transform: rotate(600deg) translateX(30px) rotate(-600deg); }
}
/* 中央：立体渐变球 + 微笑包裹 */
.spinner-core {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 52px;
  height: 52px;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  background: radial-gradient(circle at 32% 26%, #1fcf90, #0e9c66 72%);
  box-shadow: 0 6px 18px rgba(14, 156, 102, 0.4), inset 0 -4px 10px rgba(0, 0, 0, 0.14), inset 0 2px 6px rgba(255, 255, 255, 0.35);
  display: flex;
  align-items: center;
  justify-content: center;
  animation: core-pulse 2.4s ease-in-out infinite;
}
@keyframes core-pulse {
  0%, 100% { transform: translate(-50%, -50%) scale(1); }
  50% { transform: translate(-50%, -50%) scale(1.08); }
}

.splash-title {
  font-size: 38px;
  font-weight: 600;
  letter-spacing: 4px;
  color: #1a1a1a;
  margin: 0;
}
.splash-sub {
  margin-top: 10px;
  font-size: 14px;
  letter-spacing: 6px;
  color: #14AB74;
}
.splash-status {
  margin-top: 36px;
  font-size: 13px;
  color: #8c8c8c;
  letter-spacing: 1px;
}
.splash-footer {
  position: fixed;
  bottom: 28px;
  left: 0; right: 0;
  text-align: center;
  font-size: 11px;
  color: #c0c0c0;
  letter-spacing: 0.5px;
}

@keyframes splash-fade-in {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes splash-spin {
  to { transform: rotate(360deg); }
}