/* 首屏开屏：固定尺寸盒 + 两行省略；中央 #splash_logo_slot 为静态 logo */

#splash_screen {
  position: fixed;
  inset: 0;
  z-index: 2147483647;
  overflow: hidden;
  background: #000;
  opacity: 1;
  transition: opacity 1s ease;
}

/* 就绪退场：AppReadyGate 添加 `.splash_screen_exit` — 仅透明度渐隐 */

#splash_screen.splash_screen_exit {
  opacity: 0;
  pointer-events: none;
}


#splash_particles_layer {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
}

/* 外层：固定宽高，仅动画 transform + opacity */
.splash_particle {
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 1;
  box-sizing: border-box;
  width: var(--box_w, 340px);
  height: var(--box_h, 96px);
  padding: 0;
  margin: 0;
  opacity: 0.88;
  transform: translate3d(-50%, -50%, 0) translate3d(var(--dx), var(--dy), 0) scale(1);
  transform-origin: center center;
  backface-visibility: hidden;
  will-change: transform, opacity;
  animation-name: splash_fly_to_center;
  /* ease-out：前半段时间位移更多，更快进入可视区 */
  animation-timing-function: cubic-bezier(0.22, 0.61, 0.36, 1);
  animation-iteration-count: infinite;
  animation-fill-mode: none;
}

/* 内层：两行截断 + 省略号，尺寸由父级固定 */
.splash_particle_text {
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 2px 4px;
  color: #fff;
  font-family:
    system-ui,
    -apple-system,
    'Segoe UI',
    Roboto,
    'Helvetica Neue',
    Arial,
    'PingFang SC',
    'Microsoft YaHei',
    sans-serif;
  font-size: var(--fs_start, 24px);
  font-weight: 500;
  line-height: 1.35;
  text-align: center;
  overflow: hidden;
  word-break: break-word;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  text-overflow: ellipsis;
}

@keyframes splash_fly_to_center {
  0% {
    transform: translate3d(-50%, -50%, 0) translate3d(var(--dx), var(--dy), 0) scale(1);
    opacity: 0.88;
  }
  100% {
    transform: translate3d(-50%, -50%, 0) translate3d(0, 0, 0) scale(0);
    opacity: 0;
  }
}

/* 默认隐藏；仅当 hostname 在 constants/sdnt_proxy.json 的 SDNT_PROXY 中（或失败时与 sdnt_proxy.js 同默认列表）时由 splash_screen.js 添加 .sdnt_logo_visible */
#splash_logo_slot {
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 2;
  box-sizing: border-box;
  width: 100px;
  height: 100px;
  margin: 0;
  padding: 0;
  transform: translate(-50%, -50%);
  display: none;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}

#splash_logo_slot.sdnt_logo_visible {
  display: flex;
}

#splash_logo_slot img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
  filter: brightness(0) invert(1);
  animation: splash_logo_loading_blink 1.6s ease-in-out infinite;
  will-change: opacity;
}

@keyframes splash_logo_loading_blink {
  0%,
  100% {
    opacity: 0.38;
  }
  50% {
    opacity: 1;
  }
}

@media (prefers-reduced-motion: reduce) {
  #splash_logo_slot img {
    animation: none;
    opacity: 1;
  }

  .splash_particle {
    animation: none !important;
    opacity: 0 !important;
    transform: translate3d(-50%, -50%, 0) translate3d(0, 0, 0) scale(0) !important;
  }
}
