body { 
    padding: 0; 
    margin: 0;
    /* 更加柔和高端的浅蓝渐变背景，带有微弱的发光感 */
    background: radial-gradient(circle at 50% 30%, #ffffff 0%, #e6f2ff 40%, #c1e3ff 100%); 
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

#unity-container { position: absolute; }
#unity-container.unity-desktop { left: 50%; top: 50%; transform: translate(-50%, -50%); }
#unity-container.unity-mobile { width: 100%; height: 100%; }

#unity-canvas { 
    background: transparent; /* 依赖 body 的精美背景 */
}
.unity-mobile #unity-canvas { width: 100%; height: 100%; }

#unity-loading-bar { 
    position: absolute; 
    left: 50%; 
    top: 50%; 
    transform: translate(-50%, -50%); 
    display: none;
    width: 480px; 
    z-index: 10;
}

/* 呼吸动画效果赋给 Logo */
@keyframes breathing {
    0% { transform: translateX(-50%) scale(0.98); opacity: 0.9; }
    50% { transform: translateX(-50%) scale(1.02); opacity: 1; }
    100% { transform: translateX(-50%) scale(0.98); opacity: 0.9; }
}

#unity-logo { 
    width: 400px;
    height: 360px;
    background: url('unity-logo-dark.png') no-repeat center;
    background-size: contain; 
    margin: 0 auto; 
    position: absolute; 
    top: -380px; 
    left: 50%; 
    transform: translateX(-50%);
    animation: breathing 3s ease-in-out infinite; /* 加入呼吸灯效果 */
    z-index: 1; 
    filter: drop-shadow(0 10px 20px rgba(12, 172, 247, 0.15)); /* 为Logo添加柔和的高光阴影 */
}

/* 现代风格的加载条底槽 */
#unity-progress-bar-empty { 
    width: 100%;
    height: 12px;
    background: rgba(162, 222, 250, 0.4);
    backdrop-filter: blur(4px);
    border-radius: 999px;
    position: relative;
    will-change: width;
    box-shadow: inset 0 1px 3px rgba(0,0,0,0.05), 0 4px 10px rgba(12, 172, 247, 0.1);
    overflow: hidden;
}

/* 高颜值渐变加载条 */
#unity-progress-bar-full { 
    width: 0%; 
    height: 100%;
    background: linear-gradient(90deg, #3bb3f9 0%, #0088ff 100%);
    border-radius: 999px;
    top: 0;
    left: 0;
    transition: width 0.5s cubic-bezier(0.2, 0.8, 0.2, 1); /* 平滑追帧动画 */
    position: relative;
    will-change: width;
    box-shadow: 0 0 10px rgba(0, 136, 255, 0.5); /* 进度条发光 */
}

/* 进度条玻璃光泽扫过动画 */
@keyframes shimmer-bar {
    0% { transform: translateX(-100%); }
    100% { transform: translateX(100%); }
}

#unity-progress-bar-full::after {
    content: '';
    position: absolute;
    top: 0; left: 0; bottom: 0; right: 0;
    background: linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.4) 50%, rgba(255,255,255,0) 100%);
    animation: shimmer-bar 1.5s infinite linear;
}

/* 加载文字的高级排版 */
#unity-loading-text {
  width: 100%;
  display: block;
  text-align: center;
  margin-top: 24px;
  font-size: 16px;
  font-weight: 500;
  color: #2c3e50;
  letter-spacing: 2px;
  text-shadow: 0 1px 2px rgba(255,255,255,0.8); /* 字体反白效果，提升质感 */
}

/* 点点点加载动画 */
#unity-loading-text::after {
   content: '';
   animation: dots 1.5s infinite steps(4, end);
}
@keyframes dots {
   0%, 20% { content: ''; }
   40% { content: '.'; }
   60% { content: '..'; }
   80%, 100% { content: '...'; }
}

html,body{width:100%;height:100%;overflow:hidden;}
.webgl-content{width: 100%; height: 100%;}
.unityContainer{width: 100%; height: 100%;}

/* ---------------- 移动设备适配 ---------------- */
.unity-mobile #unity-loading-bar {
  width: 80%; 
  max-width: 360px;
}

.unity-mobile #unity-logo {
  width: 70%; 
  max-width: 260px;
  height: 160px !important; 
  top: -220px; 
  background-position: bottom center; /* 确保移动端对齐 */
}

.unity-mobile #unity-progress-bar-empty { width: 100%; }

@media (orientation: portrait) {
  .unity-mobile #unity-loading-bar { top: 45%; }
}
@media (orientation: landscape) {
  .unity-mobile #unity-loading-bar { top: 50%; }
}

@media screen and (max-width: 480px) {
  .unity-mobile #unity-logo { width: 80%; height: 140px !important; top: -180px; }
  #unity-loading-text { font-size: 14px; margin-top: 18px; }
}

@media screen and (max-width: 320px) {
  .unity-mobile #unity-logo { width: 85%; height: 110px !important; top: -140px; }
}